[thelist] CSS rounded borders in IE/Win problem

Matt Warden mwarden at gmail.com
Wed Dec 29 01:42:42 CST 2004


Rosalie,

On Tue, 28 Dec 2004 19:09:55 -0500, Rosalie Sennett
<rsennett at brainlink.com> wrote:
> The problem is not really the alignment mis-tagging issues in the CSS. The
> symptom of the problem is the </LI> tags which are sometimes used to close
> an <LI> and sometimes not.
> 
> According the HTML 4.01 spec (and prior) the </LI> tag is optional.
> 
> THIS is the problem. How does each browser handle the effect of the </LI>?

Well, but I am using XHTML 1.0 Strict. In this case the </li> closing
tag must always be used, and therefore such nesting issues ought to be
well-defined.

> Differently.
> 
> So if you want to nest... you've got to use it consistently. Which unclosed
> </LI> are those last </LI> tags closing? IE is probably asking the very same
> question!
> 
> Closing them all makes an even bigger mess.

Well, not if you're trying to write valid XHTML. To me, there is only
one possible way to interpret this markup:

...
<li>My Networking
	<ul>
		<li><a href="#">Profile</a> <a href="#">(edit)</a></li>
		<li><a href="#">Friends</a></li>
		<li><a href="#">Photo Album</a></li>
		<li><a href="#">Messages</a></li>
		<li><a href="#">Privacy</a></li>
	</ul>
</li>
...

I can't imagine that IE is interpreting the above like this, ignoring
the opening UL and LI inside the first list item:

<li>My Networking<ul><li><a href="#">Profile</a> <a href="#">(edit)</a></li>
<li><a href="#">Friends</a></li>
<li><a href="#">Photo Album</a></li>
<li><a href="#">Messages</a></li>
<li><a href="#">Privacy</a></li>

Although I'm not even sure if that's what you were saying was the problem.

> So I think what I'd do, is simplify the process, by making an open grid with
> my <div> tags... then physically putting one of the corner img files in the
> <div> and float it... and then put the other in the background of the div...
> etc.
> 
> In other words... go for a  box within a box, but do not rely on the spacing
> in the interior box... lay everything out along the interior border of the
> outside box... let dead air float inbetween the boxes.
> 
> Problemo avoided (if not solved!)

Well, obviously I can get it to work by adding a bunch more divs. But,
I was trying to avoid adding any (more) nonsemantic elements just to
get these stupid rounded corners to work. Especially when it seems to
work in everything except IE.


Thanks,

-- 
Matt Warden
Miami University
Oxford, OH
http://mattwarden.com


This email proudly and graciously contributes to entropy.


More information about the thelist mailing list