[WSG] Horizontal List problem in IE

2004-06-29 Thread JW 
Hi

I am having problem with my horizontal list IE as 'Child A-D li' is showing
at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7. They are
all floated to the left in a straight line.

ul
liDaddy raquo;/li
ul
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
/ul


CSS as follow:

#menuSub 
{
font-family : Verdana, Helvetica, Arial,
sans-serif, Geneva;
color   : #D6D7C8;
font-size   : 12px;
font-weight : bold;
clear   : both;
padding : 12px 10px 0px 7px;
}

#menuSub ul {display: inline; margin: 0; padding: 0;}

#menuSub li {padding-right: 10px; float: left;} 

#menuSub li a {color: #A5A682;  text-decoration: none;}

#menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;}


The final effect should show as:

Daddy  Child A | Child B | Child C | Child D

And not:

Daddy  
Child A | Child B | Child C | Child D



Best Wishes, 
Jaime ...





*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*

Re: [WSG] Horizontal List problem in IE

2004-06-29 Thread Nick Gleitzman 
Hard to tell exactly without seeing full context (a link is better than 
a code extract), but why not do this and avoid the nested list:

ul
liDaddy raquo;/li
li/li
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
Nick
___
Omnivision. Websight.
http://www.omnivision.com.au/
On Tuesday, June 29, 2004, at 10:12  PM, JW wrote:
Hi
I am having problem with my horizontal list IE as 'Child A-D li' is 
showing
at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7. 
They are
all floated to the left in a straight line.

ul
liDaddy raquo;/li
ul
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul
/ul
CSS as follow:
#menuSub
{
font-family : Verdana, Helvetica, Arial,
sans-serif, Geneva;
color   : #D6D7C8;
font-size   : 12px;
font-weight : bold;
clear   : both;
padding : 12px 10px 0px 7px;
}
#menuSub ul {display: inline; margin: 0; padding: 0;}
#menuSub li {padding-right: 10px; float: left;} 
#menuSub li a {color: #A5A682;  text-decoration: none;}
#menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;}
The final effect should show as:
Daddy  Child A | Child B | Child C | Child D
And not:
Daddy 
Child A | Child B | Child C | Child D

Best Wishes,
Jaime ...
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*

RE: [WSG] Horizontal List problem in IE

2004-06-29 Thread JW 
Here is the demo link:
http://design.sodesires.com/kimberley/collections/set/index.html

IE 5-6 PC  is not showing it the way I want :P 



 why not do this and avoid the nested list

If I do not use nested list, the document structure would be like:

* Daddy
* Child A
* Child B
* Child C
* Child D

With nested list:

* Daddy
- Child A
- Child B
- Child C
- Child D


Think with nested list, it makes more sense?



Best Wishes, 
Jaime ...




-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Nick Gleitzman
Sent: Tuesday, 29 June 2004 8:24 PM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Horizontal List problem in IE

Hard to tell exactly without seeing full context (a link is better than 
a code extract), but why not do this and avoid the nested list:

ul
liDaddy raquo;/li
li/li
lia href=#Child A/anbsp; |/li
lia href=# Child B/anbsp; |/li
lia href=# Child C/anbsp; |/li
lia href=# Child D/anbsp; |/li
/ul

Nick
___
Omnivision. Websight.
http://www.omnivision.com.au/

On Tuesday, June 29, 2004, at 10:12  PM, JW wrote:

 Hi

 I am having problem with my horizontal list IE as 'Child A-D li' is 
 showing
 at the bottom of 'Daddy li'. It looks fine in Firefox and Opera 7. 
 They are
 all floated to the left in a straight line.

 ul
 liDaddy raquo;/li
   ul
   lia href=#Child A/anbsp; |/li
   lia href=# Child B/anbsp; |/li
   lia href=# Child C/anbsp; |/li
   lia href=# Child D/anbsp; |/li
   /ul
 /ul


 CSS as follow:

 #menuSub
   {
   font-family : Verdana, Helvetica, Arial,
 sans-serif, Geneva;
   color   : #D6D7C8;
   font-size   : 12px;
   font-weight : bold;
   clear   : both;
   padding : 12px 10px 0px 7px;
   }

 #menuSub ul {display: inline; margin: 0; padding: 0;}

 #menuSub li {padding-right: 10px; float: left;}   

 #menuSub li a {color: #A5A682;text-decoration: none;}

 #menuSub li a:hover, #menuSub li a#menuSub-selected {color: #C2AC52;}


 The final effect should show as:

 Daddy  Child A | Child B | Child C | Child D

 And not:

 Daddy 
 Child A | Child B | Child C | Child D



 Best Wishes,
 Jaime ...


*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
* 


*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*

Re: [WSG] Horizontal List problem in IE

2004-06-29 Thread Ben Bishop 
Hi Jaime,

To correctly nest one list within another, open the new list before
closing it's parent li

example:
ul
  liParent
ul
  liChild/li
/ul
  /li
/ul


You might look through the list archives for James Ellis' posts
detailing display differences between browsers due to whitespace
between list elements.

And finally, consider replacing the parent raquo and the child pipes
with equivilent background images to clean up your mark-up. I'm sure
this has been already discussed a few times, so help in this
department should be in the archives.

-ben


HTML 4.01
http://www.w3.org/TR/html401/struct/lists.html#idx-list-3
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*

RE: [WSG] Horizontal List problem in IE

2004-06-29 Thread JW 
Thanks I'll look into it.


Best Wishes, 
Jaime ...




-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Ben Bishop
Sent: Tuesday, 29 June 2004 10:23 PM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] Horizontal List problem in IE

Hi Jaime,

To correctly nest one list within another, open the new list before
closing it's parent li

example:
ul
  liParent
ul
  liChild/li
/ul
  /li
/ul


You might look through the list archives for James Ellis' posts
detailing display differences between browsers due to whitespace
between list elements.

And finally, consider replacing the parent raquo and the child pipes
with equivilent background images to clean up your mark-up. I'm sure
this has been already discussed a few times, so help in this
department should be in the archives.

-ben


HTML 4.01
http://www.w3.org/TR/html401/struct/lists.html#idx-list-3
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
* 


*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*