CSS Div positioning woes... i.e | firefox

[a.g.r.c]

Hi guys,

This is really getting to me...

Been tearing up a theme for wordpress and stumbled into something that has had me stumped for best part of 3 hours.

The sidebar in THIS (http://2shades.net/dev) layout appears exactly the way i want it within firefox, but i.e throws it offset.

I have padded the sidebarcontainer div by 18px to replicate the maincontentdev to the left.

Any ideas of how to work the i.e hack if needs be, or sort the existing to have a global experience?

Thanks

a.g.r.c

[a.g.r.c]

Sorry guys,

ignore the post, got it fixed. :)

Cheers

[WebJoel]

You must be using IE, yes? This looks a little different in Firefox. By the screenshot image, I could imagine why.. :o

[a.g.r.c]

Hi WebJoel,

Im cross testing consistently thats how I had noticed the difference. Managed to sort the positioning problem, but have stumled into another in the form of lists.

The site seems to be throwing up a list although there is no lists set, they have all been ommited.

I dont know if you know anything about wordpress, but is it possible to run a list at file a, from function b - file b, when called from file a?

Also having problems with rollovers becoming redundant after they have been clicked, in both i.e and firefox... any suggestions?

Thanks

a.g.r.c

[WebJoel]

...

Also having problems with rollovers becoming redundant after they have been clicked, in both i.e and firefox... any suggestions?

this part sounds like classic failure to do LVHFA in the correct order (link, visited, hover, focus, active). If "a:visited" comes after "a:hover;", you might get just such an occurance. -the "visited" color will pre-empt the "hover" color, messing-up the expected color for that native state.
(I started including "a:focus" in my links to accomodate non-pointer-tool access, like for pda, tabs, etc. Basically, it means the same as "hover" except for the absence of a mouse-pointer)..

I'll look at your code in the morning,-I'm pressed for time tonite. I'm sure it's nothing too serious.
:)

[a.g.r.c]

Thanks Joel,

Ill try and follow that syntax.

Cheers again

nn

a.g.r.c

[a.g.r.c]

Yes Joel,

You are very good. That was the problem and is all fixed now. :)

If possible when you get to, any chance you could help me figure out why the sidebar is still throwing up the list bullets points on certain links?

Thanks

a.g.r.c

[WebJoel]

...If possible when you get to, any chance you could help me figure out why the sidebar is still throwing up the list bullets points on certain links?

add :

li {list-style-type:none;}

to your CSS. This removes the default 'bullets' from all "li"s on the page.

I might suggest too, that if you are going to use a "list item" ("<li>"), that it be in the correct parent element, one of either "<ul> ~ </ul>" or "<ol> ~ </ol>". What you have now won't validate, and thus, it may not look right in all browsers. IE doesn't care, and incorrectly shows you what it thinks you intended to show.
I noted that this looked a bit different on Fx last night (the vertical spacing, etc)... this might be why.

Oh yeah... why 'some li's have bullets and others didn't', -a padding-left:30px; on li ( li {padding-left;30px;} ) would reveal that the bullets on 'longer li's' are there, merely hidden by the content or container to the left. Since you don't want bullets anyway, do li {list-style-type:none;} and no "padding-left:foo:bar" required.