Tue, 2006-06-13 05:42
I don't really consider myself new to CSS but I've noticed on some design sites that have example CSS, they will create 2 definitions for the same thing. Is there a reason for this?
Example:
html,body {
margin: 0;
padding: 0;
}
html,body {
height: 100%;
}
What is the point in this? I can add height: 100% to the first one and it works just the same and it doesn't make it seem any more organized to split them up.
Tue, 2006-06-13 05:58
#1
2 definitions for the same thing, why?
Well for the example above I'd actually combine it like this:
html, body {
margin: 0;
padding: 0;
height: 100%;
}
so if you're asking why they haven't done it that way, I couldn't tell you. Seeing the whole example might shed more light on it though.
Tue, 2006-06-13 06:31
#2
2 definitions for the same thing, why?
html,body {
margin: 0;
padding: 0;
}
html,body {
height: 100%;
}
div {
border: 10px solid #000000;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
div#test {
height: 100%;
}
div#nested {
height: 50%;
}
was the full CSS code. It was a makeshift solution for giving a DIV 100% height. I don't really think putting the height: 100% in a separate definition adds anything to it. I've seen other examples of CSS code like this but I can't think of any other examples off the top of my head.
My company designs a web app in which I had to redesign a year ago and the stylesheet included in it had multiple definitions sort of the same thing as this. I was a bit confused then too 
Tue, 2006-06-13 06:40
#3
2 definitions for the same thing, why?
Maybe the second one was copied from elsewhere and the author just forgot/was too lazy to combine them?
Tue, 2006-06-13 07:08
#4
2 definitions for the same thing, why?
In this case, it makes no sense as it's just repetition.
html,body {
margin: 0;
padding: 0;
}
body {
height: 100%;
}
would make sense though; "apply no margins and padding to html and body, and give body ONLY a height of 100%".