PDA

View Full Version : CSS Question


gigiloumill
03-25-2011, 02:32 PM
Guys, I have several css rules set up for a .p and .h3 tag, however, when I set rules for an .a tag everything changes. Does anyone how to get around that? I need for the .p and .h3 to stay the same. Thanks

DWcourse
03-25-2011, 02:39 PM
You don't need the period in front of p, h3 or a in CSS style rules. You just use the tag name and it is applied automatically. The period creates a style class rule that you have to apply with the style attribute ( <p style="mystyle"> for instance).

Other than that, we'd need to see the code.

Corrosive
03-25-2011, 02:39 PM
a is a link so have you wrapped links in paragraph and header tags?

gigiloumill
03-25-2011, 03:01 PM
Thanks guys...C, how do I wrap a link in paragraph? can you give a visual?

gigiloumill
03-25-2011, 03:08 PM
Never mind.. I got it. My only question would be, how do I make to distinct p tags? thanks

Corrosive
03-25-2011, 03:39 PM
Never mind.. I got it. My only question would be, how do I make to distinct p tags? thanks

use a class;

<p class=""></p>

DWcourse
03-25-2011, 03:39 PM
Never mind.. I got it. My only question would be, how do I make to distinct p tags? thanks

I'm not sure what you mean.

<p>paragraph 1</p>
<p>paragraph 2</p>

???

gigiloumill
03-26-2011, 05:05 PM
O.K. guys, here's an easy one that I can't figure out. the CSS code looks like this: <style type="text/css">
.info_content {
height: auto;
width: 600px;
margin-right: auto;
margin-left: auto;
}
.content {
height: 160px;
width: 600px;
background-color:white;
}
.content_pic {
height: 150px;
width: 200px;
float: left;
margin-top: 5px;
margin-left: 5px;

}
.content_info {
float: right;
height: 150px;
width: 380px;
margin-top: 5px;
margin-right: 5px;
background-color:#F5F2FF;

}
img {
border:none;
}
h3 {
font-family:"Times New Roman", Times, serif;
font-size:14px;
color:#F00;
text-transform:uppercase;
text-decoration:underline;


}
p {
font-family:"Times New Roman", Times, serif;
font-size:12px;
color:#333;
text-transform:capitalize;
font-weight:400;
text-align:left;
text-decoration:none;

}


</style>

Here's the link to what I'm getting. http://test.highoctaneclubs.com/pagination.php?page=1

My problem is that I can't get the h3 and p tags to change according to the CSS rule. All links seem to stay in blue...Does anyone have a suggestion? Thanks.

DWcourse
03-26-2011, 05:39 PM
Inside you h3 tags you have link or <a> tags. The default coloring for you links is overwriting you h3 style rule. So you need to replace your h3 rule with:

h3 a, h3 a:visited (
font-family:"Times New Roman", Times, serif;
font-size:14px;
color:#F00;
text-transform:uppercase;
text-decoration:underline;
}

Your p rule is fine. You've just chosen a very dark gray for that color and it's hard to notice the difference between it and black.

gigiloumill
03-26-2011, 06:12 PM
Great, thanks

domedia
03-26-2011, 08:08 PM
*all* browsers have developers tools that lets you see which CSS rule is affecting your element. Use them. F12 in IE and FF, Ctrl+shift+i in Chrome.
If you do not know why an element has certain color on the page, you shouldn't be making pages in the first place 8)