CSS
.contain {
max-width:960px;
text-align:center;
}
.category {
position:relative;
display: inline-block;
float:left;
padding:10px;
}
.category2 {
position:relative;
display: inline-block;
pading:10px;
}
.category3 {
position:relative;
display: inline-block;
float:right;
margin-right:50%;
padding:10px;
}
Run Code Online (Sandbox Code Playgroud)
HTML
<div align="center" class="category">
<img src="gemstoneshomebutton.png" />
</div>
<div align="center" class="category2">
<img src="dichroichomebutton.png" />
</div>
<div align="center" class="category3">
<img src="filigreehomebutton.png" />
</div>
Run Code Online (Sandbox Code Playgroud)
我试图在容器div内对齐3个309像素宽,111像素高的图像,并且它们不对齐中心,并且第三个图像在另外两个图像下方跳跃.我试图调整容器的宽度和3个div,我已经尝试过表格并改变实际html的宽度但没有成功.
这是我第一次使用divs,我认为它们会更容易,也许我的数学在分配宽度时是关闭的,或者我只是将它构造成错误.![这里是我想要实现的一个例子,图中的三个类别.] http://i49.tinypic.com/2r2uqso.jpg
任何和所有的帮助将不胜感激.