Fri, 2004-09-10 14:42
Hello. Here's a newbie question: isn't a p style defined as part of a DIV id supposed to affect every <p> inside that DIV? For example (simplified):
Stylesheet
#block {
position:relative;
width:500px;
etc;
}
#block p {
position:relative;
padding-right:100px;
font:9pt "Arial";
letter-spacing:1px
}
HTML
<div id="block"> <p>Hello</p> </div>
Isn't "Hello" supposed to appear as designed, and only when it appears in the "block" context?
Thanks for any help.
Fri, 2004-09-10 19:22
#1
DIV-specific <p>
Hi talino,
Yes, it is supposed to unless other p styles elsewhere are given more weight.
Hope that helps
Fri, 2004-09-10 19:28
#2
DIV-specific <p>
Hello Tony. Thanks for your reply. What do you mean by "weight"? From what it seems here, if I have a totally unrelated "p" selector somewhere which has some properties set which I don't want to use in the nested "p" selector, I have to explicitly tell the nested one to nothave margins, nothave padding etc. Is this correct?
Fri, 2004-09-10 19:35
#3
DIV-specific <p>
Hi talino,
It would be easier if you could provide a link.
In CSS a system of weight is used to overcome conflicts between styles.
ID's, because of their specificity are given a heigh weight, so your style should override any other p styles that might interfere with the p styles in #block.
If you use !important somewhere else it may cause override your style.p{color:red !important;}
Hope that helps
Sat, 2004-09-11 07:08
#4
DIV-specific <p>
I think I got it now - you mean ID precedes classes & regular selectors?
In case you want to look at what I did (comments most welcome):
in /css/divStyles.css you'll see than I had to redefine <h1> (used in the home section) when inside the #imageBlock div (used in the tutorials section). I hope I've done this correctly (works ok in firefox & ie6).
Regards
Sat, 2004-09-11 20:45
#5
DIV-specific <p>
You may find explanations about weight and conflicts here :
http://css.maxdesign.com.au/selectutorial/advanced_conflict.htm
a comment about your test page:
I wouldn't let an uncoded email address in my web pages. Hope you intend to encode it.
You could simplify your stylesheet :
I think
p {
padding-right:40%;
text-align:justify;
font:9pt "Microsoft Sans Serif", "Sans-Serif", "Arial", "Helvetica";
letter-spacing: 1px;
color: #333333;
}
div#imageblock p {
text-align:justify;
font:9pt "Microsoft Sans Serif", "Sans-Serif", "Arial", "Helvetica";
letter-spacing: 1px;
color: #333333;
padding:0px;
}
can be replaced byp {
padding-right:40%;
text-align:justify;
font:9pt "Microsoft Sans Serif", "Sans-Serif", "Arial", "Helvetica";
letter-spacing: 1px;
color: #333333;
}
div#imageblock p {
padding:0px;
}
and so on...
It can help you to spot a conflict
Sat, 2004-09-11 22:06
#6
DIV-specific <p>
Thanks for the optimization tip. I'm still struggling with all this since I only started this week... still having problems with understanding how everything fits together. I'll optimize everything in due time.
As to the email, my hosting server has "antispam" advertised. I thought this would take care of things, unless that's not what you imply is dangerous in leaving an unencoded email. How would one encode one anyway? Is it supposed to be used against bots?
Thanks again for your comments.
Sun, 2004-09-12 08:31
#7
DIV-specific <p>
You may trust your hosting provider.
You can find very clever encoding solutions in this forum
or look for website email encode / protect website email for many simple solutions
It is a way / precaution to fight against email harvesters, bots and clever spammers...