Layout verschoben
Verfasst: 07.03.2010, 20:56
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;
}
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;
}