PDA

View Full Version : Does nested CSS exist?



thenextbesthang
Nov 9th, 2006, 05:53 PM
Basically what I want to do is to make the top 20% of the screen orange, and make sure that some text always stays in that orange box.

Would the synax be sumthin like this



.divtop
{
width: 100%;
height: 25%;
border-color: black;
border-style: solid;
border-top-width: 1px;
border-left-width: 1px;
border-right-width: 1px;
border-bottom-width: 0px;
background: orange;
.texttop
{
text-align: center;
text-size: 30px;
}
}

<div class = "divtop">
<p class = "texttop"> Some Text Here </p>
</div>

Bill Posters
Nov 9th, 2006, 07:58 PM
I've often wished that nested CSS rules were possible.
It makes so much sense.

But, alas, no.

It would be…

.divtop {
width: 100%;
height: 25%;
border: 1px solid black;
border-bottom: 0 none;
background: orange;
}

.divtop .texttop {
text-align: center;
text-size: 30px;
}

Perhaps they'll see the wisdom of nested CSS rules in a future version.

mark87
Nov 9th, 2006, 08:08 PM
Some elements will inherit the properties of its parent, but using selectors correctly is the only way at the moment to use 'nested CSS'.