Tr.Gg Sari Css Tasarimi Kod Paylasimli

<div id="tasarim"> <div id="baslik"></div> <div id="ust"></div> <div id="orta"> <div class="solsutun"><div class="arrowlistmenu"><h3 class="headerbar">CSS Library</h3>
<ul>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links & Buttons</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>
</ul>

<h3 class="headerbar">CSS Drive</h3>
<ul>
<li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
<li><a href="http://www.cssdrive.com/index.php/menudesigns/">Menu Gallery</a></li>
<li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
<li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
<li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
<li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
</ul>

</div>
</div> <div class="sagsutun"><br />

</div> </div> <div id="alt"></div> </div>

h1#title{display: none;} h2#title span {display: none;} div.header{display: none;} li.nav_element{list-style-type: none;} li.nav_element{display: none;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background: url(http://www.backgroundlabs.com/backgrounds/182.jpg) top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background: url(http://i0908.hizliresim.com/2009/8/1/447.jpg); width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(http://i0908.hizliresim.com/2009/8/1/297.jpg); width: 1007px; height: 215px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(http://i0907.hizliresim.com/2009/7/31/8243.jpg); width: 1007px; height: 393%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 15px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(http://i0908.hizliresim.com/2009/8/1/235.jpg); width: 1007px; height: 160px; float: left; } #kommentartext { background-image:url(); }

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.arrowlistmenu{
width: 180px; /*width of menu*/
}

.arrowlistmenu .headerbar{
font: bold 14px Arial;
color: white;
background: black url(http://i0908.hizliresim.com/2009/8/1/411.png) repeat-x center left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 10px; /*header text is indented 10px*/
}

.arrowlistmenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a{
color: #A70303;
background: url(media/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}

.arrowlistmenu ul li a:visited{
color: #A70303;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #A70303;
background-color: #F3F3F3;
}

</style>