Layout verschoben

herr-loeffler · : 02.03.2010 : 46

Hallo

Ich hab heute mal mein Portfolio umgemodelt.

Is ja auch alles in Ordnung, nur im Blog auf jeder Artikelseite ist das Layout viel zu weit nach Links gerutscht. Allerdings nur im IE

Ich find aber den Fehler nicht...

Hier mal das CSS.. vielleicht sieht einer den Fehler

/*
Theme Name: BlueBubble
Theme URI: http://www.thomasveit.com/bluebubble-free-premium-wordpress-portfolio-theme/
Description: Minimal & Elegant Portfolio Theme
Version: 1.1
Author: Thomas Veit
Author URI: http://www.thomasveit.com

The CSS, XHTML and design is released under GPL:
http://www.opensource.org/licenses/gpl-3.0.html
*/

/* basics */

*{margin:0; padding:0;}

body {
background:#FFFFFF;
font-family: verdana, arial, tahoma, sans-serif;
font-size: 11px;
margin:20px;
}

h1 {font-size: 26px; line-height: 42px;}
h2 {font-size: 14px; text-transform: uppercase;}
h3 {font-size: 12px; text-transform: uppercase;}
h4 {font-size: 10px; text-transform: uppercase;}

img{ border: none; padding:0; }
img a{border:none;}

img.left{ float: left; border: none; padding: 6px 0 0 0; }
img.right{ float: right; border: none; padding: 0 0 0 6px; }

blockquote{
border-left:1px solid #333333;
margin-left:15px;
padding:0 12px 0 12px;
}

code{
font-family:"Courier New", Courier, monospace;
}

/* links */

a{
color:#0ab9e5;
text-decoration:none;
outline: none;
}

a:hover{text-decoration: underline;}

#sidebar ul li a {
color: #333333;
display: block;
text-decoration: none;
}

#sidebar ul li a:hover {
color:#333333;
background-color: #ededed;
}

/* container */

#container {
width: auto;
margin: 0 auto;
padding:0;
background:#FFFFFF;
color:#333;
overflow: hidden;
}

/* header */

#header {
background:#FFFFFF;
width: 960px;
height: 100px;
color: #fff;
}

#header h1{
font:normal 20px georgia, times;
padding:20px 0 0 16px;
margin:0;
}

#header h1 a{color: #404040; text-decoration: none;}
#header h1 a:hover{color: #666; text-decoration: none;}

#header h2{
font:normal 10px georgia, times;
color:#333;
padding: 0 0 0 18px;
margin:0;
}

/* content */

#content {
float: right;
width:700px;
overflow: hidden;
}

.box {
width: 310px;
height: 150px;
border: 1px solid #CCCCCC;
margin-bottom: 10px;
background: url(images/loader.gif) center center no-repeat;
}

.post {
margin:0 35px 30px 0;
padding:0;
line-height: 20px;
float: left;
width: 312px;
height: 260px;
overflow: hidden;
}

.boxsingle {
width: 657px;
height: 318px;
border: 1px solid #CCCCCC;
margin-bottom: 10px;
background: url(images/loader.gif) center center no-repeat;
}

.postsingle {
margin:0 0 30px 0;
padding:0;
line-height: 20px;
width: 657px;
}

.post h2 {
font:bold 26px;
text-transform: uppercase;
}

.post h2 a, .postsingle h2 a {
color: #333333;
text-decoration: none;
}

.post h2 a:hover, .postsingle h2 a:hover {
color: #777;
text-decoration: none;
}

.postsingle h1 {
font:bold;
text-transform: uppercase;
line-height: 42px;
display: block;
border-bottom: 1px dotted #333333;
}

.postsingle h1 a {
color: #333333;
text-decoration: none;
font-size: 26px;
}

postsingle h1 a:hover {
color: #777;
text-decoration: none;
}

.post ul {}

.post li {}

.entry p{margin:12px 0; }

.postmetadata{
clear: both;
padding:6px;
margin: 10px 0;
color: #000000;
background: #EFEFEF;
}

.navigation {
font-size:11px;
width:100%;
float:left;
margin:0;
padding:0;
overflow:hidden;
}

.alignleft a{float:left; margin:25px 0;}
.alignright a{float:right; margin:25px 0;}

hr {
margin: 5px 0 20px 0;
}

#sidebar hr {
border: none 0;
border-top: 1px dotted #CCCCCC;
height: 1px;
}

ul, ol {
margin-left: 30px;
}

/* sidebar */

#sidebar {
font-family: verdana, arial, tahoma;
font-size:12px;
width:210px;
float:left;
margin:0;
padding: 0;
line-height: 20px;
}

#sidebar div {
margin-bottom: 20px;
}

#sidebar h2{
font:normal 12px verdana, arial, tahoma;
color: #333333;
margin: 0;
padding: 0;
line-height: 20px;
}

#sidebar label{
font:normal 11px verdana, arial, tahoma;
color: #000;
margin: 0;
padding: 0;
}

#sidebar p {margin:0; padding:0;}

#sidebar img {padding: 0; margin: 0;}

#sidebar ul {
margin:0px 0 15px 0;
padding:0;
display: block;
width:100%;
}

#sidebar ul li {
margin: 0;
padding: 0;
line-height: 20px;
list-style-type: none;
display: block;
width: 100%;
border-bottom: 1px dotted #CCCCCC;
}

#sidebar ul ul {
margin:14px 0;
padding:0;
}

#sidebar ul ul li {
list-style-type: none;
}

#sidebar ul ul ul{
margin: 0;
padding: 0;
}

#sidebar ul ul ul li{
padding: 0 0 0 15px;
list-style-type: square;
color: #898989;
}

#sidebar input, #sidebar textarea {
margin-bottom: 5px;
}

input#emailmebtn {
height:27px;
background: #FFFFFF;
padding: 3px;
}

input#emailmebtn:hover {
cursor: pointer;
background: #CCCCCC;
padding: 3px;
}

textarea#message {
font: verdana, arial, tahoma, sans-serif;
}

/* comments */

input, textarea {
border: 1px solid #CCCCCC;
padding: 2px;
font-family: verdana, arial, tahoma, sans-serif;
font-size: 11px;
}

#searchsubmit:hover {
cursor: pointer;
background: #CCCCCC;
}

.commentlist {
width: 600px;
}

#commentform {
background: #EFEFEF;
padding: 20px;
width: 617px; /* because of 20px padding */
}

#commentform textarea {
font-family: verdana, arial, tahoma, sans-serif;
font-size: 11px;
width: 500px;
padding: 2px;
}

#commentform input {
width: 230px;
height:15px;
padding: 2px;
}

#commentform p {
margin-bottom: 7px;
}

input#submit {
height:27px;
background: #FFFFFF;
padding: 3px;
margin-top: 7px;
}

input#submit:hover {
cursor: pointer;
background: #CCCCCC;
padding: 3px;
}

.text {
border-bottom: 1px dotted #CCCCCC;
margin: 10px 0 10px 0;
padding: 0 0 15px 0;
}

.text p {
line-height: 17px;
padding: 0px 15px;
color: #333333;
}

.avatar_ {
float: left;
margin: 0 10px 0 0;
}
.avatar_admincomment {
float: left;
margin: 0;
}

.avatar img {
border: 1px solid #CCCCCC;
}

.commenttext {
float: right;
width: 500px;
background: #EFEFEF;
padding: 10px;
}

.clearfix {
clear: both;
}

.commentlist blockquote{
border-left:1px dotted #333333;
margin-left:20px;
padding:0 12px 0 0px;
margin-bottom: 10px;
}

/* misc */

img.centered {
display: block;
margin-left: auto;
margin-right: auto;
padding: 0px;
border: 1px solid #CCCCCC;
}

img.alignright {
padding: 0px;
margin: 0 0 2px 14px;
display: inline;
border: 1px solid #CCCCCC;
}

img.alignleft {
padding: 0px;
margin: 0 14px 2px 0;
display: inline;
border: 1px solid #CCCCCC;
}

.alignright {
float: right;
}

.alignleft {
float: left
}

.wp-capxion {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* opxional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-capxion img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-capxion p.wp-capxion-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

scysys · : 06.12.2008 : 694 : Herne

Oller Spammer

http://www.abakus-internet-marketing.de/foren/viewtopic/t-82661.html#690236

Sigignatur

herr-loeffler · : 02.03.2010 : 46

UUPS..sorry.........aber wie jesagt, jetzt war ich die halbe Nacht dran...und auf den artikelseiten besteht das Layout Problem noch immer.

Grafik und Webdesign für Wittenberg

herr-loeffler · : 02.03.2010 : 46

Ich werd noch irre hier...jetzt dacht ich ich hätts...aber nö...hab alle möglichen Widths jetzt durch...aber nichts

Grafik und Webdesign für Wittenberg

ishmael · : 18.04.2009 : 102

Dein Markup ist nicht Valide und außerdem schickst du den IE in den Quirksmodus mit dem Kommentar vor dem Doctype. Die korrekte Darstellung wird somit zur Loterie.

Mein Blog

herr-loeffler · : 02.03.2010 : 46

Aber warum läufts dann auf allen Seiten, ausser DIREKT auf den Artikelseiten?

Grafik und Webdesign für Wittenberg

ishmael · : 18.04.2009 : 102

Weil auf allen Seiten außer der Artikelseite kein Kommentar vor dem Doctype steht.

Nebenbei bemerkt, kann ich deine Startseite nicht lesen. Von den Absätzen unter den Bildern sind jeweils nur zwei Zeilen zu sehen, der Rest verschwindet im Nirvana. Elemente, die Fließtext enthalten sollten nie mit fixen Höhen blockiert werden.

Mein Blog

herr-loeffler · : 02.03.2010 : 46

Jetzt besser?

Grafik und Webdesign für Wittenberg

ishmael · : 18.04.2009 : 102

Worüber reden wir jetzt? Nimm doch erstmal den Kommentar raus und schreib auch in der Artikelansicht den Doctype an erste Stelle, wenn der IE 6 dann immer noch spinnt kann man ja weiter suchen.

Mein Blog

herr-loeffler · : 02.03.2010 : 46

Das hab ich geändert, allerdings änderts noch nichts.
Hab jetzt erstmal das Theme gewechselt..bis mir ne Lösung einfällt,
das mit den Absätzen war bei Browsershot nicht zu sehen...komisch

Grafik und Webdesign für Wittenberg

ishmael · : 18.04.2009 : 102

Meine Mindestschriftgröße im Browser liegt bei 14px. Alles darunter kann ich nur mit Anstrengung lesen. Deine 11px für <body> werden also ignoriert.

Mein Blog

herr-loeffler · : 02.03.2010 : 46

@ishmael jetzt kannstes och lesen..

Gruss Christian

ishmael · : 18.04.2009 : 102

Leider nicht.

Das Problem ist die Höhe für .post.

Mein Blog

herr-loeffler · : 02.03.2010 : 46

Was genau stört Dich jetzt?

Grafik und Webdesign für Wittenberg

ishmael · : 18.04.2009 : 102

Mich stört da nichs. Ich dachte nur, es könnte Dich vieleicht stören, wenn sämtliche Projektbeschreibungen auf der Startseite zur Hälfte abgeschnitten sind. Woran das liegt, habe ich dir bereits gesagt.

Mein Blog