Help With DIV Styles

**mikemalphurs** · 03-04-2008, 07:56 PM

Hello-
I have a CSS text mark-up issue I could use some help with. I have a Div Tag that has a "p" tag applied to it. Whnever I try to create an additional class to use for the p tag within that DIV, it does not "take". Is there anyway to have a Class over-ride the P tag applied to the DIV?

Here is the DIV:

Code:

<div class="InteriorText">
<p>When it comes to technology, have you ever noticed that there is always something that someone doesn't want you to buy?</p></div>

Here is the DIV's CSS:

Code:

.InteriorText p{
color: #666666;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8em;
}

Here is the class I would like to apply to certain P tags within the same DIV, but is being "overridden" by the above CSS:

Code:

.ContentSubHead {
font-size: 2.0em;
font-weight: bold;
}

And finally, the HTML code snippet:

Code:

<div class="InteriorText">
<p class="_ContentSubHead">When it comes to technology, have you ever noticed that    there is always something that someone doesn't want you to buy? </p></div>

Any help would be greatly appreciated... Thanks!

**rangana** · 03-05-2008, 02:49 AM

Yes, it should work, unluckily, you used a wrong class. I thought it should be _ContentSubHead instead of ContentSubHead??

You call a class ContentSubHead which is incorrect, it should be _ContentSubHead

See this code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
.InteriorText p{
color: #666666;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8em;
}
._ContentSubHead {
font-size: 2.0em;
font-weight: bold;
}
</style>
<title></title>
</head>
<body>
<div class="InteriorText">
<p>When it comes to technology, have you ever noticed that there is always something that someone doesn't want you to buy?</p>
<p class="_ContentSubHead">When it comes to technology, have you ever noticed that    there is always something that someone doesn't want you to buy? </p>
</div>
</body>
</html>

See if it helps

**mikemalphurs** · 03-05-2008, 05:15 AM

Thanks for your help... I accidently posted an old piece of code in there. I actually do have the class applied in the HTML without an underscore.

Still no dice!

**codeexploiter** · 03-05-2008, 05:46 AM

Check the following code

Code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<title> </title>
		<style type="text/css">
		.InteriorText{
			color: #666666;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 0.8em;
		}
		.ContentSubHead {
			font-size: 2.0em;
			font-weight: bold;						
		}
		</style>
		<script type="text/javascript">
		
		</script>
	</head>
	<body>
		<div class="InteriorText">
			<p class="ContentSubHead">When it comes to technology, have you ever noticed that there is always something that someone doesn't want you to buy?</p>
		</div>
	</body>
</html>

In this case it is working as it is expected, it consider the 'ContentSubHead' class on the 'p' element correctly.

One correction I've made is

.InteriorText p{
color: #666666;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8em;
}

The above class is mentioned in your post from which I've removed that p from the class name.

You can define the 'ContentSubHead' class in a number of ways other than the one I've used.

(1) .InteriorText .ContentSubHead

(2) p .ContentSubHead

(3) .InteriorText p .ContentSubHead

**mikemalphurs** · 03-05-2008, 09:35 PM

Yep.. Re-defining the ContentSubHead class worked!

Thanks so much!

Thread: Help With DIV Styles

Thread Tools

Search Thread

Help With DIV Styles

Correct Tag

Bookmarks

Bookmarks

Posting Permissions