我被一个问题困住了,希望堆叠社区能帮我。
我想按列出的顺序放置带有文本的图像,所以我使用了ul>li列表。当我写一段文字比图像高度少的时候,我的问题就开始了,下一段就在我不想要的旁边。我知道它不是很好的描述,所以我附上了它的图像。
这是那个截图的HTML
<ul><li>
<h2>title</h2>
<img src="" class="alignleft" width="200px"/> My text content
</li>
repeat the same
我在我的网站上有一个容器,它将所有东西都保持在一定的宽度内,就像这样。
HTML
<div class="container">
// content in here
</div>
CSS
.container{
max-width: 1300px
}
现在我有一个div,我想忽略最大宽度并扩展到边缘,但我不希望它被绝对定位并从网站流中删除,所以我这样做了。
HTML
<div class="extend-past">
// content here
</div>
CSS
.extend-past{
我在为类创建的一个项目中有一个页面,其中我想要在左侧对齐图像,右侧的文本在图像的中间对齐。我决定不使用html元素,而是尝试在我的外部CSS中使用内部CSS div元素。我的问题是我不能让它们在垂直方向上正确对齐。我有水平对齐,但文本要么显示在图像上方一行,要么显示在图像下方一行。我尝试了这篇文章中包含的技术,但它们没有解决我的问题。
这是我的内部CSS。
<style type="text/css">
/* left div holding the image */
#left {
width:170px;
align:left; }
/* right div