I want to make div for class "BLACK" which doesn't resize on resizing browser

user_17891294 0
Viewed 34

How to make a div which do not resize with browser resize? div for that code is as below there are other 7 classes same as purple but I want BLACK not to resize with browser what are possible steps I can look for

<div class="BLACK">
  <p>THIS IS BLACK DIV AND IT WILL NOT RESIZE WITH BROWSER</p>
</div>
<div class="PURPLE">
  <p>THIS IS PURPLE DIV AND IT WILL RESIZE WITH BROWSER</p>
</div>

.BLACK {
  background-color: black;
  background-size: contain;
  background-size: cover;
  font-size: fixed;
  height: 20%;
  width: 20%;
  display: block;
  margin-right: 30%;
  margin-top: 1%;
  padding-top: 9%;
  padding-bottom: 8%;
}

.PURPLE {
  background-color: purple;
  height: 7%;
  padding-top: 0.05%;
  padding-bottom: 0.05%;
  margin-left: 20%;
  text-align: center;
}
height resize size css html
1 Answers

div size can be fixed using px unit like width:20px; or width:300px;

<div class="BLACK">
  <p>THIS IS BLACK DIV AND IT WILL NOT RESIZE WITH BROWSER</p>
</div>
<div class="PURPLE">
  <p>THIS IS PURPLE DIV AND IT WILL RESIZE WITH BROWSER</p>
</div>

.BLACK {
  background-color: black;
  background-size: contain;
  background-size: cover;
  font-size: fixed;
  height: 300px;
  width: 350px;
  display: block;
  margin-right: 30%;
  margin-top: 1%;
  padding-top: 9%;
  padding-bottom: 8%;
}

.PURPLE {
  background-color: purple;
  height: 7%;
  width: 20%;
  padding-top: 0.05%;
  padding-bottom: 0.05%;
  margin-left: 20%;
  text-align: center;
}
user_174735180
Related