Leola13
Erfahrenes Mitglied
Hai,
ich habe seit kurzem WordPress installiert und versuche derzeit die Optik ein wenig anzupassen.
Leider ist der Header Bereich oben links nicht "gross" genug und die Sidebar ist unten zu "kurz".
Anbei einmal der Code der meiner Meinung nach dafür verantwortlich ist. Ich werde irgendwie nicht schlau daraus.
CSS
Datei :
Bin für jeden Tipp dankbar. Anzusehen unter : http://www.leola13.de/
Danke.
Ciao Stefan
ich habe seit kurzem WordPress installiert und versuche derzeit die Optik ein wenig anzupassen.
Leider ist der Header Bereich oben links nicht "gross" genug und die Sidebar ist unten zu "kurz".
Anbei einmal der Code der meiner Meinung nach dafür verantwortlich ist. Ich werde irgendwie nicht schlau daraus.
CSS
HTML:
**************** Body *********************/
body {background:#1d1d1d; font:12px Georgia, "Times New Roman", Times, serif;}
#wrapper {width:980px; margin:auto;}
#left {width:710px; float:left; position:relative;}
/**************** Links *********************/
a:link, a:visited {text-decoration:none; color: #900;}
a:hover {color:#000;}
/**************** Header *********************/
#header h1 {font-weight:normal; text-align:center; padding:10px 0 10px 0;}
#header h1 a{color:#FFF; text-transform:uppercase;}
#header h2 {font-size:12px; font-style:italic; font-weight:normal; color:#CCC; text-align:center; background-color:#1d1d1d; padding:6px 0 6px 0;}
/**************** Sidebar *********************/
.sidebar {padding:60px 15px;}
.sidebar h2 {color:#FFF; font-size:15px; padding-bottom:10px; text-transform:uppercase; font-weight:normal;}
.sidebar ul {padding-bottom:20px;}
.sidebar ul li a {display:block; padding:3px; color:#FFF; text-decoration:underline; font-style:italic;}
/**************** Blog *********************/
#blog {background:url(images/bg.jpg) repeat-y; margin-top:160px; min-height:700px;}
.entry { padding:10px 10px 10px 210px;}
.post { padding-bottom:10px; margin-bottom:20px;}
.post h2 { margin-bottom:15px; border-bottom:3px solid #0d0d0d; font-weight:normal;}
.post h2 a {font-style:italic; color:#0d0d0d;}
.post h2 a:hover {color:#ccc;}
.imgpost {float:left; width:150px; height:150px; border:5px solid #f2f2f2;}
.imgpost:hover { filter: alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}
.content { line-height:22px; width:320px; float:left; margin-left:10px;}
.singlecontent h1, .singlecontent h2, .singlecontent h3, .singlecontent h4, .singlecontent h5, .singlecontent h6 {padding:10px 0 10px 0; font-weight:normal; font-style:italic; border:none; margin:0;}
.singlecontent p {margin-bottom:15px;}
.singlecontent ul {margin:10px;}
.singlecontent ul li {padding-left:20px; line-height:22px; background:url(images/bullet.jpg) 0px 6px no-repeat;}
.singlecontent ol li {padding-left:0px; line-height:22px; margin-left:20px; list-style:decimal;}
blockquote {padding-left:10px; margin:20px; border-left:3px solid #841212;}
cite {padding:10px 0 10px 0;}
.meta { border-top:3px solid #841212; padding-top:5px; margin-top:15px; line-height:20px; font-size:11px;}
.meta a:hover {text-decoration: underline;}
.date {color:#999;}
.singlecontent { line-height:22px;}
#ad468 {width:468px; height:60px; position:absolute; top:80px; right:20px;}
#sidebar {width:185px; position:absolute; background-color:#393939; top:30px; left:10px;}
.rmore {padding-top:10px;}
.rmore a {width:300px; background-color:#841212; color:#FFF; padding:5px;}
h2.search {font-size:14px; color:#999; font-weight:normal; padding-bottom:5px; font-style:italic; margin-bottom:20px;}
#right {float:left; width:270px;}
Datei :
HTML:
<div id="header">
<h1><a href="http://www.leola13.de/">leola13</a></h1>
<h2>Fotos, Bildbearbeitung und mehr</h2>
</div><!--header-->
<ul class="sidebar">
<li id="categories-3" class="widget widget_categories"><h2 class="widgettitle">Kategorien</h2>
<ul>
<li class="cat-item cat-item-1"><a href="http://www.leola13.de/?cat=1" title="Alle unter Allgemein abgelegten Artikel ansehen">Allgemein</a>
</li>
<li class="cat-item cat-item-3"><a href="http://www.leola13.de/?cat=3" title="Geschichten die das Leben schreibt">Alltagsgeschichten</a>
</li>
<li class="cat-item cat-item-5"><a href="http://www.leola13.de/?cat=5" title="Meine kleinen Spielereien">Bildbearbeitung</a>
</li>
<li class="cat-item cat-item-4"><a href="http://www.leola13.de/?cat=4" title="Wie der Name schon sagt : Fotos und ihre Geschichten">Foto</a>
</li>
</ul>
</li>
Bin für jeden Tipp dankbar. Anzusehen unter : http://www.leola13.de/
Danke.
Ciao Stefan