Tue, 2007-11-06 10:58
The CSS:
ul#menu {
float:right;
margin:0;
padding:0;
list-style:none;
}
li#mn1{
width: 24px;
height: 24px;
background: url(images/menu_refresh.png) no-repeat 0 0;
}
li#mn2{
width: 24px;
height: 24px;
background: url(images/menu_save.png) no-repeat 0 0;
}
li#mn3{
width: 24px;
height: 24px;
background: url(images/menu_email.png) no-repeat 0 0;
}
li#mn4{
width: 24px;
height: 24px;
background: url(images/menu_print.png) no-repeat 0 0;
}
ul#menu a{
display:block;
float:right;
width: 24px;
height: 24px;
text-indent: -9999px;
text-decoration: none;
overflow: hidden;
}
The HTML:
I'm trying to float the list to the right of my page. At the moment it's going over there but still displaying vertically. Maybe I'm not clearing it right?!
Tue, 2007-11-06 11:12
#1
You haven't floated the
You haven't floated the <li>s.
Tue, 2007-11-06 11:18
#2
ul#menu
ul#menu {
float:left;
width: 100px;
margin:0;
padding:0;
list-style:none;
}
ul#li {
float: left;
}
li#mn1{
width: 24px;
height: 24px;
background: url(images/menu_refresh.png) no-repeat 0 0;
}
li#mn2{
width: 24px;
height: 24px;
background: url(images/menu_save.png) no-repeat 0 0;
}
li#mn3{
width: 24px;
height: 24px;
background: url(images/menu_email.png) no-repeat 0 0;
}
li#mn4{
width: 24px;
height: 24px;
background: url(images/menu_print.png) no-repeat 0 0;
}
ul#menu a{
display:block;
float:left;
width: 24px;
height: 24px;
text-indent: -9999px;
text-decoration: none;
overflow: hidden;
}
Still no joy :shrug:
Tue, 2007-11-06 11:41
#3
That's because this: ul#li
That's because this:
ul#li {
float: left;
}
should be:
#menu li {
float: left;
}
What you've got refers to a list with an ID of li.
Tue, 2007-11-06 11:46
#4
Thanks Tyssen, I really
:blushing:
Thanks Tyssen, I really should have noticed that.