博客作者遇到在HTML页面中使用浮动属性(float)使`<ul>`列表在文本旁浮动的问题。尝试了设置相对定位(relative)和使用包裹元素，但效果不理想。CSS代码和HTML结构已给出，讨论中提出了可能需要为`<ul>`设置明确的宽度以使浮动生效的建议，并提供了可能的解决方案链接。
我有一个问题，在文本旁边浮动ul。HTML和CSS：浮动属性问题
以下是图像：
我想，也许我不得不使用relative位置属性，以显示它，我希望它的方式？但是，我知道应该使用float属性，但它不适合我。我已经使用其他div(logoAndMainMenu-Wrapper)创建的文本和ul包装试过，但float属性仍不能正常工作....
这里是我的HTML：
而这里的我的CSS：
#AndrewText {
font-size: 2em;
}
.fixedWidth1 {
margin: 0 auto;
width: 1000px;
height: 150px;
background-color: green;
border: 2px solid black;
}
.logoAndMainMenu-Wrapper {
border: 2px solid yellow;
}
.fixedWidth1 ul {
list-style-type: none;
text-align: center;
margin: 0;
background-color: green;
border: 2px solid orange;
}
.fixedWidth1 ul li {
display: inline; /* LI are horizontal */
padding: 5px;
border-right: 2px solid yellow;
}
.fixedWidth1 ul li a {
text-decoration: none; /* No UNDERLINE */
}
/* Normal, unvisited link */
.fixedWidth1 ul li a:link {
color: #FFFFFF;
}
/* Visited link */
.fixedWidth1 ul li a:visited {
color: #FFFFFF;
}
/* Mouse over link */
.fixedWidth1 ul li a:hover {
color: yellow;
}
/* Selected link */
.fixedWidth1 ul li a:active {
color: #FFFFFF;
}
任何帮助都可以。谢谢！！！
+0
你有设置在UL明确的宽度是多少？没有人，浮动将无法正常生效。 –
2014-10-06 04:57:12
+0
我想你可能是这个http://jsfiddle.net/j8cq1neL/ –
2014-10-06 04:57:15
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
