jcombs_31 Posted June 27, 2008 Share Posted June 27, 2008 I guess this has never become a huge issue with me, but something I can't seem to get around. If I set an element such as a paragraph p { padding: 0; } and later decide I need a class to have some padding on the left .padded { padding: 0 0 0 20px; } and then in my markup <p class="padded">This padding is ignored based on my first padding</p> How do I get around this? Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/ Share on other sites More sharing options...
haku Posted June 27, 2008 Share Posted June 27, 2008 p.padded. Although .padded will take precedence over the p, so what you are saying doesn't really make sense. Anyways, you can read this for more info: http://htmldog.com/guides/cssadvanced/specificity/ Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576057 Share on other sites More sharing options...
jcombs_31 Posted June 27, 2008 Author Share Posted June 27, 2008 I guess I should have included that I did try it that way as well with the same results. I had to actually put something like this #container .padded { xxx } and it works. Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576095 Share on other sites More sharing options...
dbrimlow Posted June 27, 2008 Share Posted June 27, 2008 Actually, you are better off with: #container p.padded { xxx } In your specific instance, you only want to target certain paragraphs within the parent container by assigning them the padded class. Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576156 Share on other sites More sharing options...
jcombs_31 Posted June 27, 2008 Author Share Posted June 27, 2008 well, depends, say I want to add that padding to another element your example wouldn't work very well. Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576174 Share on other sites More sharing options...
ToonMariner Posted June 27, 2008 Share Posted June 27, 2008 @jcombs download firebug (why is the FireFox3 release not finished!!!!) and you can see which rules are being applied to your markup very easily. It is actuall better to just have #container .padded in fact its better to have the minimum amount of code possible whether it be css, xhtml or php!!! reducing mass makes your projects much more maintainable.. Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576327 Share on other sites More sharing options...
haku Posted June 28, 2008 Share Posted June 28, 2008 if .padded and/or p.padded isn't taking precedence over p, then you have a different CSS declaration that has the padding set to zero that is overpowering them. Both of the declarations are stronger than p alone. Using firebug will show you which declaration is the strongest, and you can see where t hat declaration is coming from. Link to comment https://forums.phpfreaks.com/topic/112215-breaking-inheritance/#findComment-576508 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.