Clear CSS

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Clear CSS

Post by alex.barylski »

I have a menu define din my application it uses <ul> and <li>

Unfortunately it's a horizontal menu and I needed to float the elements..., the CSS looks like:

Code: Select all

#menu ul {

}

$menu li {
  float: right
  ...
}
Now I'm using just the elements for another tree like control...and it looks like the <li> elements are inheriting what was set for the menu items...although none of the styling is being applied, such as colors, etc...just the float and inline type properties seem to be applied...

I've tried setting each <li> with an inline style="float: clear"

But that didn't seem to do the trick.. :(

Should this be happening? I didn't apply any styles to the native <li> element but as I've shown above...
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

$menu…

not… #menu?
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Post by alex.barylski »

That was just a typo... :oops:

My bad...problem still persists... :(
User avatar
Kieran Huggins
DevNet Master
Posts: 3635
Joined: Wed Dec 06, 2006 4:14 pm
Location: Toronto, Canada
Contact:

Post by Kieran Huggins »

they shouldn't be inheriting the same properties, just like you shouldn't have two elements with the same ID 8)

Was that it?
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Post by alex.barylski »

Kieran Huggins wrote:they shouldn't be inheriting the same properties, just like you shouldn't have two elements with the same ID 8)

Was that it?
Is that whats going?

I didn't think it was assigning an element the same ID...I thought that was how selectors worked???

Code: Select all

#menu li {
  /* Specify styles which are specific to ANY <li> element inside any element which has a *menu* as an ID */
}

#menu a {
  /* Styles for any <a> which is inside #menu */
}
Thats causing a duplicate ID? I thought that was only the case inside the HTML when I used the same ID twice?
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

You are correct. You should have a single instance of an ID in the HTML. You can have multiple rules for the same ID in the CSS.

I'd have to see some more code to understand the problem.

In general, some things are inherited, some things not. If you want to "overrule" floats, set an element to:

Code: Select all

#menu li { float:none; }
Post Reply