[thelist] CSS again: suspected IE funkiness on inline UL

[Toby]

I think you need to practise isolating issues and debugging issues like this
as you appear to have problems doing that alone. Its not particularly easy
to start with, and is time consuming (including head banging against the
wall time) but you will get there and learn in a different way to people
showing you via email.

In respect to your problem, I recommend you remove _all_ styling and start
from the top with a * rule to clear most of the browser defined styles. This
will avoid your own personal confusions with your project and give you a
fresh outlook on how you are building your css & xhtml. If you respond to
this post please post your link again so I can review it. If you haven't
used it already get the webdeveloper toolbar by Chris Pedrick for FF also >
http://chrispederick.com/work/webdeveloper/ 

Hope that helps,
Toby

> -----Original Message-----
> From: thelist-bounces at lists.evolt.org [mailto:thelist-
> bounces at lists.evolt.org] On Behalf Of ben morrison
> Sent: 19 December 2006 10:36
> To: thelist at lists.evolt.org
> Subject: Re: [thelist] CSS again: suspected IE funkiness on inline UL
> 
> On 12/19/06, Joel D Canfield <joel at spinhead.com> wrote:
> 
> > While I certainly don't wish to seem unappreciative of the many people
> > here who've taken time (sometimes quite a bit) to look at this and come
> > up with ideas, in the end, it really seems like we're all guessing.
> >
> > Is CSS really this complicated? I mean, I'm new at this kind of thing,
> > so I'm not entirely surprised that I'm not finding the problem. But when
> > I've clearly identified that the problem is *not* the navigation code,
> > which works *perfectly* in the source page, but when copied *verbatim*
> > to my page, breaks - well, it seems like everyone is trying to solve the
> > wrong problem, or just plain guessing.
> >
> > Again, I'm just trying to get my head around the big picture: is CSS
> > really a matter of guessing, twiddling, and voodoo? I do understand that
> > IE is a massive PITA and that, sometimes, the rules don't apply. But can
> > it really be this random?
> 
> CSS is complicated to begin with, but you do end up understanding its
> foibles and IEs bugs the more you use it. When you say copied
> *verbatim* and it breaks, then generally there is something that is
> missing, be it a parent having an effect on its child, doctype and
> very often and really annoyingly - whitespace can have a big effect
> when it comes to lists.
> 
> I did post some code but our evaluation server is down as we have just
> moved office. My version involved using a background image - only
> needs to be 1x1 pixel in the blue border colour and here's the code:
> 
> <style type="text/css">
> 	#navlist {
> color: #ffffff;
> background:#ededed url(nav-bottom.gif) 0 100% repeat-x;
> text-align: left;
> margin:0px;
> padding:0px;
> width: 100%;
> clear:both;
> float:left;
> }
> 
> #navlist li {
> margin:0px 10px 0 0;
> float:left;
> list-style:none;
> }
> 
> #navlist li a {
> font-weight:bold;
> color: #ffffff;
> background-color: #ff6600;
> text-decoration: none;
> padding: 0 1em;
> float:left;
> display:block;
> margin-top:1px;
> 
> }
> 
> #navlist li span {
> font-weight:bold;
> color: #000066;
> background-color: #ffffff;
> text-decoration: none;
> padding: 0 1em;
> border: 1px solid #000066;
> border-bottom: 1px solid #ffffff;
> float:left;
> display:block;
> }
> 
> #navlist li a:hover {
> font-weight:bold;
> color: #ff6600;
> background-color:#ffffff;
> }
> 
> 	</style>
> 
> <ul id="navlist">
> 			<li><span>Home</span></li>
> 			<li><a href="/ii/services.asp" title="link to a list
and
> explanation of our services">Services</a></li>
> 			<li><a href="/ii/intranet/" title="link to samples
of
> our tools,
> and soon, a live demo!">Demo</a></li>
> 			<li><a href="/ii/about.asp" title="link to
information
> about the
> principals of Intranet Intelligence">About</a></li>
> 			<li><a href="/ii/distinction.asp" title="why you
should
> choose
> 'Intranet intelligence'">Why Choose Us?</a></li>
> 			<li><a href="/ii/contact.asp" title="link to the
contact
> form">Contact</a></li>
> 		</ul>
> 
> Ben
> --
> 
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
> 
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !