Tuesday, December 11, 2012

Display Table Property two

Posted by at 

<html>
<head>
  <style type="text/css">
        .toolbar ul {
            display:table-row;
        }
        .toolbar ul li
        {
            display: table-cell;
            height: 100px;
            list-style-type: none;
            vertical-align: middle;
            border: solid 5px gray;
        }
    </style>
</head>
<body>
    <div class="toolbar">
        <ul>
            <li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
            <li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
<li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
<li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
</ul><ul>
 <li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
            <li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
<li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
<li><a href="#">first item<br />
                <img src='http://www.cfht.hawaii.edu/en/news/ngcfhtannounce/Banner_image2.jpg' width='100px' alt='' /><br />
                first item</a></li>
        </ul>
    </div>
</body>
</html>

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)