gpt4 book ai didi

css - div 使用 css 混淆了使用 float left 和 right

转载 作者:太空宇宙 更新时间:2023-11-04 14:36:15 24 4
gpt4 key购买 nike

CSS 和一个 div 我正在尝试对图像使用 float left,对它的描述使用 float right。我似乎无法在不打乱他们位置的情况下将它们对齐。我尝试调整文本,但每次文本太多时,整行段落换行,就会发生这种情况。

http://postimg.org/image/b2n0g31sh/

我怎样才能避免这种情况并使图像保持在它的位置并且文本保持在右边,并且当达到它的极限时它应该换行而不会使自己从 float 位置困惑到正确的位置?到目前为止,这是我的代码。

http://jsfiddle.net/blackknights/93WGq/

 <div id="container" align="center">
<div id="container2">
<div id="wrapper">
<div id="header">
<img src="tsclogo2.jpg" />
</div>
<div id="content">
<div id="menubar">
<ul id="mcolor">
<li><a href="tdesign.html"><font color="#000000"> Home </</a>
</li>
<li class="active"><a href=""><font color="#000000">About Us</font></a>
</li>
<li><a href="gallery.html"><font color="#000000">Gallery</font></a>
</li>
<li><a href="contactus.html"><font color="#000000">Contact Us</font></a>
</li>
</ul>
</div>
</div>
<div id="contentbody">
<div id="contentbodytext">
<div id="divaboutusintroductionparagraph">&nbsp;&nbsp;INTRODUCTION PARAGRAPH INTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPHINTRODUCTION PARAGRAPH</div>
<div id="imageholder">
<img src="bridge.jpg" width="230" height="120" />
<div id="divfloatright">
<p>You rarely hear any entrepreneurs who succeeded in a snap. dddddddddddddddddddddddddddddddddd</div>
</div>
</div>
</div>
<!--closing tag for wrapper -->
</div>
<!--closing tag for container2 -->
</div>
<!--closing tag for container -->

最佳答案

假设您希望图像和描述作为开始新行的部分,请尝试以下操作:

#imageholder {
border: 1px dotted red;
overflow: auto;
}
#imageholder img {
padding: 50px;
float: left;
}
#divfloatright {
text-align:left;
padding-right:50px;
word-break:break-all;
}

参见演示:http://jsfiddle.net/audetwebdesign/93WGq/5/

关于css - div 使用 css 混淆了使用 float left 和 right,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18726384/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com