在html中怎样让两条线重叠,html – 如何让h1和ul坚持在同一条线上

美好的一天又一次.

我有一个(看似)简单的问题.我正在尝试显示< h1>和< ul>在同一条线上.我使用浮动,内联和许多其他方式,但它似乎不起作用.它就像标题不想与无序列表一起播放.所有帮助赞赏.

html代码如下所示：

IRIS

我正在使用的CSS代码如下所示：

.page

{

width: 70%;

margin-left: Auto;

margin-right: Auto;

}

body

{

margin:0;

padding:0;

background: url('/Content/Image/background-gradient.png') repeat-x;

}

#header

{

background-color: Gray;

}

#header h1:

{

margin:0;

padding:0;

display:inline;

}

ul#menu

{

display:inline;

border:solid;

border-width:1px;

border-bottom: 1px #5C87B2 solid;

padding: 0 0 2px;

margin: 0;

text-align: right;

}

ul#menu li

{

display: inline;

list-style: none;

}

ul#menu li#greeting

{

padding: 10px 20px;

font-weight: bold;

text-decoration: none;

line-height: 2.8em;

color: #fff;

}

ul#menu li a

{

padding: 5px 10px;

float:left;

font-weight: bold;

text-decoration: none;

line-height: 2.8em;

background-color: #e8eef4;

color: #034af3;

}

ul#menu li a:hover

{

background-color: #fff;

text-decoration: none;

}

ul#menu li a:active

{

background-color: #a6e2a6;

text-decoration: none;

}

ul#menu li.selected a

{

background-color: #fff;

color: #000;

}

#main

{

border: solid black;

clear:both;

width:75%;

padding: 30px 30px 15px 30px;

margin-bottom: 30px;

}

好的,所以找到了问题的答案,感谢Mathieu和其他所有人.

这是我用过的：

#header h1

{

margin:0;

padding:0;

padding-left:7px;

display:inline;

}

ul#menu

{

width:85%;

float: right;

display:inline;

padding: 0 0 2px;

margin: 0;

text-align: right;

}

如果有人想到更好的东西请发帖:)