4 replies [Last post]
domerdel
Offline
Regular
Redding, CA
Last seen: 10 years 6 weeks ago
Redding, CA
Timezone: GMT-7
Joined: 2004-05-27
Posts: 17
Points: 11

I have a main div container that looks like this:

#inner-right
	{
	float: right;
	width: 690px;
	z-index: 3px;
	margin-top: 30px;
	margin-right: 15px;
	margin-bottom: 15px;
	margin-left: 5px;
	}
 
#inner-right p
	{
	margin: 0px;
	padding: 15px 0px 0px 0px;
	line-height: 18px;
	font-size: 11px;
	}
 
#inner-right h2
	{
	margin: 0;
	background: url(../images/headline_underline.jpg) no-repeat;
	width: 500px;
	height: 25px;
	color:#036;
	}
 
#inner-right ul
	{
	list-style-type: none;
	margin: 20px 0px 0px 15px;
	padding: 0px 0px 30px 0px;
	}
 
#inner-right li
	{
	height: 40px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;
	}

On a product page I have a callout box for products. Essentially, it's just another DIV inside of a DIV, so I gave it specific properties:

#product-callout
	{
	float: left;
	margin:0px;
	padding: 20px 20px 20px 20px;
	width: 247px;
	height: 150px;
	background: url('../images/product_callout.jpg');
	}
 
#product-callout p
	{
	margin: 0px;
	padding: 0px;
	font: normal 14px Arial, Helvetica, sans-serif;
	}
 
#product-callout ul
	{
	padding:0px;
	margin: 0px 0px 0px 10px;
	}
 
#product-callout li
	{
	padding:0px;
	margin:0px;
	line-height: 16px;
	}

The only thing "product-callout" is reacting to is padding and background URL. It keeps pulling properties from "inner-right"

here's the link to the page I'm referencing:
http://www.warrantyadminservices.com/MrktTemplates/dsd/products.html

downtap
downtap's picture
Offline
Enthusiast
Dallas, TX
Last seen: 5 years 45 weeks ago
Dallas, TX
Timezone: GMT-7
Joined: 2008-01-18
Posts: 227
Points: 36

Since the #inner-right div

Since the #inner-right div is the parent, the ul is inheriting its properties first, not the child's. What I mean is, that the ul is being styled by your #inner-right ul CSS property, not #product-callout ul. One solution would be to assign the ul a class name, and style it from there.

domerdel
Offline
Regular
Redding, CA
Last seen: 10 years 6 weeks ago
Redding, CA
Timezone: GMT-7
Joined: 2004-05-27
Posts: 17
Points: 11

downtap wrote:Since the

downtap wrote:

Since the #inner-right div is the parent, the ul is inheriting its properties first, not the child's. What I mean is, that the ul is being styled by your #inner-right ul CSS property, not #product-callout ul. One solution would be to assign the ul a class name, and style it from there.

Thank you. I will try that. I was trying to avoid class, but if that's what I have to do, so be it.

downtap
downtap's picture
Offline
Enthusiast
Dallas, TX
Last seen: 5 years 45 weeks ago
Dallas, TX
Timezone: GMT-7
Joined: 2008-01-18
Posts: 227
Points: 36

You can also remove the

You can also remove the #inner-right ul property if it is not being used elsewhere on the site, but I have a feeling it may be.

domerdel
Offline
Regular
Redding, CA
Last seen: 10 years 6 weeks ago
Redding, CA
Timezone: GMT-7
Joined: 2004-05-27
Posts: 17
Points: 11

downtap wrote:You can also

downtap wrote:

You can also remove the #inner-right ul property if it is not being used elsewhere on the site, but I have a feeling it may be.

It is being used elsewhere.