create a 4x3 grid of css panels
I am trying to find a 开发者_开发百科CSS tutorial that would enable me to create a 4x3 grid of features like on this site http://www.ewedding.com/features.php
If anybody can suggest one it would be great! All the tutorials that I have found seem to style the entire page rather that a particular part of the page.
Thanks in advance
Decbrad
the page you link uses an UL as outer element and an LI as inner element so you have this:
<ul>
<li>Feature1.1</li>
<li>Feature1.2</li>
<li>Feature1.3</li>
</ul>
<ul>
<li>Feature2.1</li>
<li>Feature2.2</li>
<li>Feature2.3</li>
</ul>
<ul>
<li>Feature3.1</li>
<li>Feature3.2</li>
<li>Feature3.3</li>
</ul>
use a CSS definition like this:
ul{
float:left;
width: //specify the width
display:block;
}
li{
list-style: none;
display:block;
}
etc.
That said, I think a CSS table layout is better for this:
http://www.onenaught.com/posts/201/use-css-displaytable-for-layout
精彩评论