2个div在同一行 [英] 2 divs on same line

问题描述

嗨


i在我的主页中要求以下布局：


1 div for header

1 div for footer


在这些div之间我想要一个div用于左侧菜单，然后是一个div用于中心的

内容，然后在每个内部我将放置一个内容持有者

其他页面继承


我的问题是div创建了一个新行吗？每个人都说不再使用桌子

了，那你怎么用css看看呢？


谢谢

解决方案

使用浮动


< div>

标题

< ; / div>

< div>

< div style =" float：left;">

Left

< / div>

< div style =" float：left;">

正确

< / div>

< / div>

< div style =" clear：both;">

页脚

< / div>


清除在页脚上意味着它就像一个正常的div，并且不会漂浮到之前的div边缘。


Daniel < Da ***** @ vestryonline.comwrote in message

news：％2 **************** @ TK2MSFTNGP05.phx.gbl .. 。

嗨


i在我的主页中需要以下布局：


1 div用于标题

1 div用于页脚


在这些div之间我想要一个div用于左侧菜单，然后一个div用于

中心的内容，然后在每个内部我将放置一个内容持有者

其他页面继承


我的问题是div创建一个新行？而且每个人都说不再使用

表了，那么你如何用css看看呢？


谢谢

Daniel写道：

嗨

i在我的主页中需要以下布局：


1 div为标题

1 div for footer


在这些div之间我想要一个div用于左侧菜单，然后是一个div用于中心的

内容，然后在每个内部我将放置一个内容持有者

继承其他页面


我的问题是div创建了一个新行吗？而且每个人都说不再使用桌子

了，你怎么用css看看呢？


谢谢

你可以使用SPAN而不是DIV，因为它们不是块元素，所以

它们不会放在彼此之下。


或者，您可以使用CSS位置。属性设置为绝对

或relative将DIV置于阻挡位置之外。


HTH，

Laurent

-

Laurent Bugnion [MVP ASP.NET]

软件工程： http：/ /www.galasoft-LB.ch

PhotoAlbum： http://www.galasoft-LB.ch/pictures

支持加尔各答的儿童： http://www.calcutta-espoir.ch

如果你想通过一张桌子打动别人无需css布局，准备

花几天时间学习和练习。


如果你想要一个简单可靠的解决方案，请使用表格。


是的，默认情况下div会在一个单独的行上呈现。


-

Eliyahu Goldin，

软件开发人员&顾问

Microsoft MVP [ASP.NET]
http： //msmvps.com/blogs/egoldin
http://usableasp.net

丹尼尔 < Da ***** @ vestryonline.comwrote in message

news：％2 **************** @ TK2MSFTNGP05.phx.gbl .. 。

嗨


i在我的主页中需要以下布局：


1 div用于标题

1 div用于页脚


在这些div之间我想要一个div用于左侧菜单，然后一个div用于

中心的内容，然后在每个内部我将放置一个内容持有者

其他页面继承


我的问题是div创建一个新行？而且每个人都说不再使用

表了，那么你如何用css看看呢？


谢谢

Hi

i have a requirement for the following layout in my masterpage:

1 div for header
1 div for footer

Between those divs i want a div for the left menu, then a div for the
content in the center, then inside each i will place a content holder for
other pages to inherit off

My problem is a div creates a new line? And everyone says not to use tables
anymore, so how do you get that look with css?

Thanks

解决方案

Use "float"

<div>
Header
</div>
<div>
<div style="float:left;">
Left
</div>
<div style="float:left;">
Right
</div>
</div>
<div style="clear:both;">
Footer
</div>

The "clear" on the footer means it acts like a normal div and won''t float to
the edge of the div before.

"Daniel" <Da*****@vestryonline.comwrote in message
news:%2****************@TK2MSFTNGP05.phx.gbl...

Hi

i have a requirement for the following layout in my masterpage:

1 div for header
1 div for footer

Between those divs i want a div for the left menu, then a div for the
content in the center, then inside each i will place a content holder for
other pages to inherit off

My problem is a div creates a new line? And everyone says not to use
tables anymore, so how do you get that look with css?

Thanks

Hi,

Daniel wrote:

Hi

i have a requirement for the following layout in my masterpage:

1 div for header
1 div for footer

Between those divs i want a div for the left menu, then a div for the
content in the center, then inside each i will place a content holder for
other pages to inherit off

My problem is a div creates a new line? And everyone says not to use tables
anymore, so how do you get that look with css?

Thanks

You can use SPAN instead of DIV, because they are not block elements, so
they are not placed underneath each other.

Alternatively, you can use the CSS "position" property set to "absolute"
or "relative" to place DIVs outside of their block position.

HTH,
Laurent
--
Laurent Bugnion [MVP ASP.NET]
Software engineering: http://www.galasoft-LB.ch
PhotoAlbum: http://www.galasoft-LB.ch/pictures
Support children in Calcutta: http://www.calcutta-espoir.ch

If you want to impress someone by having a table-less css layout, be prepare
to spend next few days on learning and practicing.

If you want a simple and reliable solution, use tables.

And yes, by default a div will render on a separate line.

--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]
http://msmvps.com/blogs/egoldin
http://usableasp.net
"Daniel" <Da*****@vestryonline.comwrote in message
news:%2****************@TK2MSFTNGP05.phx.gbl...

Hi

i have a requirement for the following layout in my masterpage:

1 div for header
1 div for footer

Between those divs i want a div for the left menu, then a div for the
content in the center, then inside each i will place a content holder for
other pages to inherit off

My problem is a div creates a new line? And everyone says not to use
tables anymore, so how do you get that look with css?

Thanks

这篇关于2个div在同一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！