html - CSS/HTML : Have text at left side

标签 html css

<span style='float: left; margin: 10px; width: 60px; display: block;'>
<img style='border: 1px solid #FFF; width: 61px; height: 80px;' src='images/profilePhoto/thumbs/86.jpg'>
<br>
<a href='profil.php?id=86'>Megan F.</a>
<br><br>
</span>
<div style='margin-left: 90px;'>
<h1>(inget ämne)</h1>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla urna eget urna euismod aliquet. Duis porta volutpat blandit. Phasellus bibendum bibendum porta. Nunc molestie tristique leo, sed euismod orci ultricies vitae. Mauris non libero a leo ultricies laoreet. Suspendisse luctus urna vel sapien tristique vitae semper nulla eleifend. Integer congue aliquam pharetra. Phasellus diam neque, tincidunt vel elementum vel, ornare sit amet mi. Nulla tincidunt purus in odio vulputate mollis. Nunc urna odio, rutrum eu ultricies a, facilisis ullamcorper nunc. In purus velit, varius vel laoreet eu, tincidunt non purus. Nulla facilisi. Sed ac lectus nibh. Praesent non velit nibh.<br />
... 
</div>

这就是我现在所拥有的: http://img192.imageshack.us/img192/7857/applytext.png

我怎样才能像图片中显示的那样应用文本?

最佳答案

如果您希望新文本与第二段垂直对齐,则添加一个

<div style="clear: both"></div>

在第二段之前,然后像原来那样做另一个 float 。

如果您只想将整个面板 float 在左侧,则只需将其添加到 float 内容即可。但是看起来你的新文本与第二段垂直对齐,所以上面列出的方法就可以了。

关于html - CSS/HTML : Have text at left side,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4086761/

相关文章:

html - 如何使div适合窗口的大小?

javascript - 如何在 javascript 中打开模式而不是手动单击?

html - 不同的下拉按钮在 Bootstrap 中打开相同的菜单

javascript - 空间位置在这些跨度中重要吗?

html - 图像和 Div 叠加,效果不佳

css - 对具有 "btn-normal"类的元素发出警告

html - 如何在非全屏时使背景图像 Bootstrap 响应

html - 媒体查询响应式设计

php - 如何在美德商城中获取所有类别和子类别的名称

php - 如何使用 php 访问不同页面中的 session 变量?