En Yeni Tasarımlar - tasarım 3.3

tasarım 3.3

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<div class='navbar section' id='navbar'>
<div class='widget Navbar' id='Navbar1'></div>
<div id='layout_wrapper'>
<div id='layout_edgetop'></div>
<div id='layout_container'>

<div id='header-wrapper'>
<div class='header section' id='header'><div class='widget Header' id='Header1'>
<div id='header-inner'><div class='titlewrapper'>

<h1 class='title'>web-masterim.forum.st</h1>

</div>
<div class='descriptionwrapper'>
<p class='description'><span>web-masterim.forum.st</span></p>
</div>
</div>
</div></div>
<div class='clear'></div>
</div>
<div id='top_separator'></div>
<div id='navigation'>
<div id='tabs'>
<ul>
<li class='current_page_item'>

<a href='inicio.htm' _fcksavedurl='inicio.htm'><span>web-masterim.forum.st</span></a></li>
<li><a href='#' _fcksavedurl='#'><span>web-masterim.forum.st</span></a></li>
<li><a href='http://web-masterim.forum.st' _fcksavedurl='http://web-masterim.forum.st'><span>web-masterim.forum.st</span></a></li>
<li><a href='#' _fcksavedurl='#'><span>web-masterim.forum.st</span></a></li>
</ul>

<div class='clear'></div>
</div>
</div>
<div class='spacer h5'></div>
<div id='content-wrapper'></body></html></body></html>

Tasarım Üstüne

<div id='sidebar'>
<div class='widget' id='search'>
<h2>web-masterim.forum.st</h2>
<div class='widget-content'>
<form action='web-masterim.forum.st' id='searchform' method='get'>
<div>
<table class='search'>
<tbody><tr>
<td><input id='s' name='q' type='text' value=''/></td>
<td style='padding-left: 10px;'><input src='http://pixelea.com/s/c1b484ad29.gif' type='image'/></td>
</tr>
</tbody></table>
</div></form>
</div></div>
<div class='sidebar section' id='sidebar'><div class='widget Feed' id='Feed1'>

<h2> web-masterim.forum.st
</h2>
<div class='widget-content'>
web-masterim.forum.st

</div></div>
<div class='widget BlogArchive'>

<h2>web-masterim.forum.st</h2>
<div class='widget-content'>
web-masterim.forum.st

<div id='ArchiveList'>
<div id='BlogArchive1_ArchiveList'>
</div></div>
<span class='widget-item-control'></div>
</div></div></div>

<div class='clear'></div></div>

<div id='footer'>
<p class='links'> Copyright © 2oo9  |  <a href='http://web-masterim.forum.st' _fcksavedurl='http://web-masterim.forum.st'>web-masterim</a> |
</div>
</div>
<div id='layout_edgebottom'></div>
</div></body></html></body></html>

Tasarım Altına

table {margin-left: auto;margin-right: auto}
#pre_header {display: none;}
#post_header {display: none;}
#header_container {display: none;}
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
* {
margin: 0;
padding: 0;
}
body {
background: #404040 url(http://pixelea.com/s/bcbd190dab.jpg);
font: normal 13px Verdana;
color: #345;
padding-bottom: 1em;
}
a {
color: #0066AA;
}
a:hover {
color: #003366;
}
p {
padding: 0.1em 0 0.8em;
}
h1 {
font: normal 1.8em Georgia,Tahoma,sans-serif;
}
h2 {
font: normal 1.5em Georgia,sans-serif;
}
h3 {
font: bold 1em Tahoma,sans-serif;
}
html {
height: 100%;
padding-bottom: 1px;
}
ul,ol {
margin: 0 0 1em 1.6em;
}
ul ul, ol ol {
margin: 0.3em 0 0.3em 1em;
}
img {
border: none;
}
img.bordered {
background: #FFF;
padding: 5px;
border: 1px solid #DDD;
}
img.left {
margin-right: 1em;
}
img.right {
margin-left: 1em;
}
small,.small {
font-size: 0.8em;
}
big,.big {
font-size: 1.2em;
}
#layout_wrapper {
margin: 10px auto 0;
width: 780px;
}
#layout_container {
background: #FFF;
padding: 0 5px;
}
#layout_edgetop, #layout_edgebottom {
background: url(http://pixelea.com/s/1ddf9d7177.gif) no-repeat left top;
display: block;
height: 10px;
font-size: 0;
line-height: 0;
}
#layout_edgebottom {
background-position: left bottom;
}
/* Seachform */
table.search {
width: 100%;
border-collapse: collapse;
}
.search td {
vertical-align: center;
}
#main-wrapper {
overflow:hidden;
}
.clear {
clear:both;
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}
/*-- (Cabecera) --*/
#header-wrapper {
background: #C5DEF0 url(http://pixelea.com/s/607f4ca364.jpg) repeat-x left top;
padding: 6px 18px;
}
#header-wrapper h1 {
font: normal 2.4em sans-serif;
letter-spacing: -1px;
color: #507A9A;
float:left;
}
#header-wrapper h1 a {
color: #507A9A;
text-decoration: none;
}
#header-wrapper h1 a:hover {
color: #305A7A
}
#header-wrapper p {
padding: 1.4em 0 0;
font: normal 1.1em sans-serif;
color: #667799;
float:right;
}
#top_separator {
background: url(http://pixelea.com/s/9a61c0d952.gif) repeat-x left top;
display: block;
font-size: 0;
height: 3px;
line-height: 0;
}
/*-- (Menu) --*/
#navigation {
background: #739CBA url(http://pixelea.com/s/2aadacaf3b.jpg) no-repeat left bottom;
padding: 82px 10px 0;
}
/* Tabs */
#tabs ul {
margin: 0;
padding: 0;
}
#tabs li {
display:inline;
list-style:none;
}
#tabs a {
background: url(http://pixelea.com/s/775f50f6c3.gif) no-repeat left top;
float: left;
font: bold 0.9em sans-serif;
margin-right: 3px;
padding-left: 4px;
text-decoration: none;
}
#tabs a span {
float: left;
display: block;
background: url(http://pixelea.com/s/f7b504b6a1.gif) no-repeat right top;
padding: 5px 10px 5px 6px;
color: #608AAA;
}
/* Commented Backslash Hack hides rule from IE5-Mac */
#tabs a span {float: none;}
/* End IE5-Mac hack */
#tabs a:hover span {color: #608AAA;}
#tabs a:hover {background-position: 0% -42px;}
#tabs a:hover span {background-position:100% -42px;}
#tabs li.current_page_item a {color: #47A; background-position: 0% -42px;}
#tabs li.current_page_item a span {background-position:100% -42px;}
/*-- (Contenedor) --*/
.h5 {
height:5px;
}
/* Contenido */
#content {
width: 545px;
float:left;
}
#content a {
}
#content a:hover {
}
.date-header {
color: #999999;
padding-top: 1px;
font-size: 0.85em;
float:right;
}
.post-footer, p.comment-footer {
padding: 8px 10px 6px;
background: #F5F5F5;
color: #666;
border-top: 1px solid #E5E5E5;
font-size: 0.8em;
}
.post-footer a{
color: #567;
}
.post-footer a:hover{
color: #002;
}
.post-footer .comment-link {
background:  none no-repeat left center;
padding-left: 18px;
float:right;
}
.post_bottom {
background: url(http://pixelea.com/s/1ac49e7a18.gif) no-repeat left top;
display: block;
height: 5px;
font-size: 0;
line-height: 0;
}
.feed-links {display:none;}
.blog-pager {margin:10px 0; font-size:0.8em;}
/* Sidebar */
#sidebar {
float:right;
width: 220px;
}
#sidebar ul{
margin-left: 0;
border-bottom: 1px solid #E2ECF2;
}
#sidebar li{
list-style: none;
padding: 4px;
border-top: 1px solid #E2ECF2;
border-bottom: 1px solid #D0D8DE;
}
#sidebar li:first-child {
border-top: none;
}
#sidebar li a{
text-decoration: none;
}
#sidebar li a:hover{
text-decoration: underline;
}
#sidebar h2 {
background: #C6D2DB url(http://pixelea.com/s/f38d67d112.gif) no-repeat left top;
padding: 6px 10px 5px;
font-weight: bold;
font-size: 0.9em;
color: #505E69;
display:block;
}
#sidebar .widget-content {
background: #DAE3E9 url(http://pixelea.com/s/c32a58d178.gif) repeat-x left top;
padding: 8px 10px 1px;
font-size: 0.9em;
}
#sidebar .widget {
padding-bottom: 5px;
background: url(http://pixelea.com/s/1ac49e7a18.gif) no-repeat left bottom;
margin-bottom:5px;
}
/*-- Footer --*/
#footer {
background: #A3B5C1 url(http://pixelea.com/s/c8c5fc1e62.gif) no-repeat left top;
padding: 8px 12px 2px;
font-size: 0.85em;
color: #FAFCFF;
text-align:center;
}
#footer {
color: #C8DBE8;
}
#footer a {
color: #D3E5F1;
text-decoration: none;
}
#footer a:hover {
color: #FFE;
text-decoration: underline;
}
.left {
float: left;
}
.right {
float: right;
}
.clear,.clearer {
clear: both;
}
.clearer,.spacer {
display: block;
font-size: 0;
line-height: 0;
}</body></html></body></html>

Css Koduna