Martin AJ Martin AJ - 3 months ago 8
CSS Question

How can I set a temporary padding?

Note: I guess the title of my question is nothing to do with my real question (kinda).

Here is my code:



.one{
background-color: gray;
}
.two{
padding: 20px;
}

<div class = "one">
<div class = "two">
<span>something</span>
</div>
</div>

<br>

<div class = "one">
<span>something</span>
</div>





I need to manage it how those two blocks look like the same. In reality,
div.two
isn't exist in the first of time and it will be added after a while. So I want to keep the UI without any change when
div.two
appends. How can I do that?

In conclusion, I need to have the same look for both
div.one
elements at the same time. Is that possible? (noted that I want to both of them be like the first one)

Answer

Change where the padding is applied....

.one{
  background-color: gray;
  padding: 20px;
}
.two{
  padding: 0; /* setting this to 0 should override any previous padding declarations*/
}