Seite 1 von 2

Layout verschoben

Verfasst: 07.03.2010, 20:56
von herr-loeffler
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: https://www.thomasveit.com/bluebubble-f ... lio-theme/
Description: Minimal & Elegant Portfolio Theme
Version: 1.1
Author: Thomas Veit
Author URI: https://www.thomasveit.com

The CSS, XHTML and design is released under GPL:
https://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;
}

Verfasst:
von

Hochwertiger Linkaufbau bei ABAKUS:
  • Google-konformer Linkaufbau
  • nachhaltiges Ranking
  • Linkbuilding Angebote zu fairen Preisen
  • internationale Backlinks
Wir bieten Beratung und Umsetzung.
Jetzt anfragen: 0511 / 300325-0

Verfasst: 07.03.2010, 21:15
von scysys

Verfasst: 08.03.2010, 06:34
von herr-loeffler
UUPS..sorry.........aber wie jesagt, jetzt war ich die halbe Nacht dran...und auf den artikelseiten besteht das Layout Problem noch immer.

Verfasst:
von

Verfasst: 08.03.2010, 09:38
von herr-loeffler
Ich werd noch irre hier...jetzt dacht ich ich hätts...aber nö...hab alle möglichen Widths jetzt durch...aber nichts

Verfasst: 08.03.2010, 12:02
von ishmael
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.

Verfasst: 08.03.2010, 12:05
von herr-loeffler
Aber warum läufts dann auf allen Seiten, ausser DIREKT auf den Artikelseiten?

Verfasst: 08.03.2010, 12:08
von ishmael
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.

Verfasst: 08.03.2010, 12:13
von herr-loeffler
Jetzt besser?

Verfasst: 08.03.2010, 12:25
von ishmael
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.

Verfasst: 08.03.2010, 12:40
von herr-loeffler
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

Verfasst: 08.03.2010, 13:58
von ishmael
Meine Mindestschriftgröße im Browser liegt bei 14px. Alles darunter kann ich nur mit Anstrengung lesen. Deine 11px für <body> werden also ignoriert.

Verfasst: 08.03.2010, 14:57
von herr-loeffler
@ishmael jetzt kannstes och lesen..

Gruss Christian

Verfasst: 08.03.2010, 15:27
von ishmael
Leider nicht.

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

Verfasst: 08.03.2010, 15:56
von herr-loeffler
Was genau stört Dich jetzt?

Verfasst: 08.03.2010, 16:28
von ishmael
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.