Thema: Darstellungsfehler - FF & IE7 vs. IE6
Einzelnen Beitrag anzeigen
  #3 (permalink)  
Alt 29.10.2008, 09:58
andir andir ist offline
{ display: random;}
XHTMLforum-Kenner
  
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.038
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard
Doch, ich habe eine Menge Ideen

Aber so ist das eine Zumutung. Viel Code, zusammenbauen und suchen dürfen wir selber^^ Schau doch mal in meine Sig

Mit nachfolgendem Testcase ( eigentlich deine Aufgabe) konnte ich dein Problem an einem IE7 + IE 5.5 nicht nachvollziehen:
Möglicherweise hilft es, deiner span class postmeta einen entsprechenden seitlichen Abstand zuzuweisen

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>
    <title>Titel</title>

    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
    <meta name="generator" content="Webocton - Scriptly (www.scriptly.de)" />
<style type ="text/css">
<!--  
* {
border:0 none;
margin:0;
padding:0;
}
body {
background:#FFFFFF url(images/background.gif) repeat-x scroll left top;
color:#000000;
font-family:'Verdana','Trebuchet MS','Arial',sans-serif;
margin:0;
padding:10px 0 2px;
}
h1, h2, h3, h4, h5 {
color:#336699;
font-family:'Georgia','Times New Roman';
font-weight:normal;
margin:0;
padding:0;
}
p, ul {
font-size:12px;
letter-spacing:0.1px;
line-height:18px;
}
ul {
margin:0 0 10px 25px;
}
.alignleft {
float:left;
}
a {
color:#336699;
}
a:hover {
color:#000000;
text-decoration:none;
}
.alignright {
float:right;
}
.wrap, .wrap_inheader, .content, .wrap_nav {
margin:0 auto;
padding:10px;
width:900px;
}
.content {
background:#FFFFFF none repeat scroll 0 0;
border-bottom:1px dotted #336699;
}
.wrap {
background:#FFFFFF url(images/header_bg.jpg) no-repeat scroll center top;
height:200px;
}
.clear {
display:inline-block;
}
.clear {
display:block;
}
* html .clear {
height:1%;
}
.inheader {
background:#FFFFFF none repeat scroll 0 0;
border-bottom:4px solid #CCDDEE;
border-top:2px solid #CCDDEE;
padding:10px 0;
}
.inheader .alignleft {
color:#7C9AA9;
font-size:14px;
margin-top:2px;
width:500px;
}
.inheader .alignright {
text-align:right;
width:400px;
}
.inheader .textinput {
background:#CAE9FB none repeat scroll 0 0;
border:1px solid #CAE9FB;
padding:3px;
width:220px;
}
.inheader .submitinput {
background:#5FA6CF none repeat scroll 0 0;
border:1px solid #5FA6CF;
color:#FFFFFF;
padding:2px;
}
.header {
background:#336699 none repeat scroll 0 0;
height:200px;
margin:0;
padding:0;
}
.header h1 {
font-family:'Arial','Trebuchet';
font-size:30px;
}
.header h1 a {
background:#FFFFFF none repeat scroll 0 0;
color:#E35325;
padding:15px;
text-decoration:none;
}
.header p {
color:#6B92AA;
font-size:14px;
margin:10px 0 30px 0;
width:400px;
}
.wrap_nav {
background:#336699 none repeat scroll 0 0;
border-bottom:2px solid #CCDDEE;
border-top:4px solid #CCDDEE;
font-family:"Lucida Sans Unicode";
padding:0 10px;
}
.wrap_nav ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}
.wrap_nav ul li {
display:inline;
}
.wrap_nav ul li a {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
display:block;
float:left;
font-size:18px;
margin-right:7px;
padding:5px 0;
text-align:center;
text-decoration:none;
width:130px;
}
.wrap_nav ul li.current_page_item a, .header ul li.current_page_item a:hover {
background:#CCDDEE none repeat scroll 0 0;
color:#336699;
padding-bottom:5px;
}
.wrap_nav ul li a:hover {
background:#FFFFFF none repeat scroll 0 0;
color:#336699;
}
.leftcontent {
float:left;
margin-right:15px;
width:535px;
}
.rightcontent {
float:right;
width:320px;
}
.post {
margin-bottom:20px;
}


.post {
margin-bottom:20px;
}
.post h2, .rightcontent h3, .comments h2 {
font-family:'Georgia','Times New Roman';
font-size:24px;
}
.post h2 a {
color:#336699;
padding:5px;
text-decoration:none;
}
.posthead h2 a:hover {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
}
.postmeta {
color:#336699;
display:block;
font-size:11px;
margin-top:15px;
}
.postmeta_date {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
display:inline;
padding:5px;
}
.postmeta_author a {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
text-decoration:none;
}
.postmeta_author a:hover {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
}
.postmeta_kategorie a {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
display:inline;
padding:5px;
text-decoration:none;
}
.postmeta_kategorie a:hover {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
}
.postmeta_kommentar a {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
text-decoration:none;
}
.postmeta_kommentar a:hover {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
}
.posthead {
background:#FFFFFF none repeat scroll 0 0;
border-left:5px solid #336699;
padding:10px;
}
.postcontent, .singlepage {
margin:10px 0 0 10px;
}
.postcontent h2, .singlepage h2 {
font-size:20px;
}
.postcontent p, .singlepage p {
font-size:12px;
letter-spacing:0.1px;
line-height:18px;
margin-bottom:5px;
}
.postcontent a, .singlepage a {
color:#336699;
padding:3px;
}
.postcontent a:hover, .singlepage a:hover {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
text-decoration:none;
}
.postcontent blockquote a, .singlepage blockquote a {
color:#336699;
}
.postcontent blockquote, .singlepage blockquote {
background:#CCDDEE url(images/blockqoute.gif) no-repeat scroll left top;
color:#000000;
margin:0 0 0 20px;
padding:10px 20px 10px 60px;
}
.postcontent img, .singlepage img {
margin:10px;
padding:0;
}
.postcontent a img, .singlepage a img {
border:medium none;
margin:10px;
padding:5px;
}
.postcontent a:hover img, .singlepage a:hover img {
border:2px solid #336699;
padding:3px;
}
.singlepage h2 {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
margin-top:20px;
padding:5px;
}
.singlepage h3 {
border-bottom:1px solid #336699;
font-size:16px;
margin:5px 0;
padding:5px;
}
#lightboxlink {
margin:0;
padding:0;
}
.linklist {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0 0 10px 0;
padding:0;
}
.linklist h2 {
margin-bottom:10px;
margin-top:10px;
}
.linklist li {
margin-bottom:5px;
margin-top:5px;
}
#Categories {
background:transparent url(images/folder.jpg) no-repeat scroll left center;
display:block;
margin-bottom:5px;
padding-left:20px;
width:390px;
}
#Categories, #Comments {
color:#336699;
}
#Comments {
display:block;
text-align:right;
width:110px;
}
#Comments a {
background:transparent url(images/comments.jpg) no-repeat scroll left center;
padding-left:20px;
}
.sidebar {
margin-bottom:10px;
padding:1px 10px 10px;
}
.sidebar h3 {
font-size:20px;
margin-bottom:5px;
margin-top:10px;
padding-bottom:4px;
}
.sidebar ul {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:5px 0 0;
padding:0;
}
.sidebar ul li {
margin-bottom:7px;
padding-bottom:7px;
}
.sidebar ul.half li {
float:left;
margin-bottom:7px;
padding-bottom:7px;
width:149px;
}
.sidebar .alignleft {
width:160px;
}
.sidebar .alignright {
text-align:right;
width:130px;
}
.sidebar .alignright a {
text-decoration:none;
}
.sidebar p {
font-size:11px;
line-height:14px;
margin:0;
}
.h_light {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
font-variant:small-caps;
padding:2px 5px;
}
.sidebar ul li a {
color:#336699;
display:block;
padding:5px 3px;
}
.sidebar ul li a:hover, .sidebar ul li a:active {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
}
.new_entries, .new_comments {
font-size:11px;
}
.sidebar .new_entries a {
background:transparent url(images/page.png) no-repeat scroll left center;
padding-left:18px;
text-decoration:none;
}
.sidebar .new_entries a:hover {
background:#336699 url(images/page.png) no-repeat scroll left center;
padding-left:18px;
}
.sidebar .new_comments a {
background:transparent url(images/comment.png) no-repeat scroll left top;
padding-left:18px;
text-decoration:none;
}
.sidebar .new_comments a:hover {
background:#336699 url(images/comment.png) no-repeat scroll left top;
padding-left:18px;
}
#Blue {
background:#FFFFFF none repeat scroll 0 0;
border-left:2px solid #336699;
color:#336699;
}
#Blue h3 {
border-bottom:1px solid #336699;
color:#336699;
}
#Blue ul li {
border-bottom:1px solid #CCDDEE;
margin:0;
padding:0;
}
#Orange {
background:#CCDDEE none repeat scroll 0 0;
border-right:2px solid #336699;
color:#336699;
}
#Orange h3 {
border-bottom:1px solid #FFFFFF;
color:#336699;
}
#Orange ul li {
border-bottom:1px solid #CCDDEE;
margin:0;
padding:0;
}
#Green {
background:#FFFFFF none repeat scroll 0 0;
border-left:2px solid #336699;
color:#336699;
}
#Green h3 {
border-bottom:1px solid #336699;
color:#336699;
}
#Green ul li {
border-bottom:1px solid #CCDDEE;
margin:0;
padding:0;
}
.box1 {
float:left;
margin:15px 35px 15px 0;
width:270px;
}
.box2 {
float:left;
margin:15px 15px 15px 0;
width:270px;
}
.box3 {
background:transparent url(images/rightfoot.jpg) no-repeat scroll left top;
float:right;
margin:15px 0;
width:270px;
}
.box1 p, .box2 p, .box3 p {
background:#93CBDC none repeat scroll 0 0;
color:#25819D;
font-size:13px;
line-height:16px;
padding:5px;
width:270px;
}
.box1 a, .box2 a, .box3 a {
background:#FFFFFF none repeat scroll 0 0;
color:#FF3C00;
}
.footer2 {
color:#25819D;
margin:0 auto;
padding:0 0 20px;
width:885px;
}
.header h4 {
background:#FFFFFF none repeat scroll 0 0;
color:#FF3C00;
font-size:16px;
font-weight:bold;
padding:2px;
}
.footer2 a {
background:#FFFFFF none repeat scroll 0 0;
color:#FF3C00;
padding:2px;
text-decoration:none;
}
.footer2 p {
width:885px;
}
.comentariu, .commentform {
padding:10px;
width:500px;
}
.comentariu {
background:#CCDDEE none repeat scroll 0 0;
border-left:2px solid #336699;
margin:10px 0;
}
.alt {
background:transparent none repeat scroll 0 0;
border-left:medium none;
border-right:2px solid #336699;
}
.comments h2 {
background:#FFFFFF none repeat scroll 0 0;
border-left:5px solid #336699;
margin:10px 0;
padding:10px;
}
.commentform span {
display:block;
font-size:14px;
margin:6px 0;
}
.commentform input, .commentform textarea {
background:#CCDDEE none repeat scroll 0 0;
border-color:-moz-use-text-color -moz-use-text-color -moz-use-text-color #336699;
border-style:none none none solid;
border-width:medium medium medium 3px;
color:#336699;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:16px;
font-weight:bold;
padding:8px;
width:450px;
}
.commentform textarea {
letter-spacing:0.1px;
line-height:22px;
}
.commentform input.subscribe_button {
margin-top:10px;
width:468px;
}
.comentariu .comment-meta {
border-bottom:1px solid #FFFFFF;
color:#336699;
font-size:11px;
padding-bottom:10px;
padding-top:5px;
}
.comentariu .comment-meta .date {
background:#FFFFFF none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
}
.comentariu .comment-meta .author {
background:#FFFFFF none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
}
.comentariu .comment-meta .mail a {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
display:inline;
padding:5px;
text-decoration:none;
}
.comentariu .comment-meta .mail a:hover {
background:#FFFFFF none repeat scroll 0 0;
color:#000000;
}
.alt .comment-meta {
border-bottom:1px solid #336699;
color:#336699;
font-size:11px;
padding-bottom:10px;
padding-top:5px;
}
.alt .comment-meta .date {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
}
.alt .comment-meta .author {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
display:inline;
padding:5px;
}
.alt .comment-meta .mail a {
background:#336699 none repeat scroll 0 0;
color:#FFFFFF;
display:inline;
padding:5px;
text-decoration:none;
}
.alt .comment-meta .mail a:hover {
background:#CCDDEE none repeat scroll 0 0;
color:#000000;
}
.rssfeed {
background:transparent url(images/rss.jpg) no-repeat scroll left center;
padding-left:22px;
}
-->
</style>
</head>

<body>
<div class="content">
					<div class="leftcontent">
								

<div class="post" id="post-49">
				<div class="posthead">
					<h2><a href="#" title="Ab dem 01.10.2008 neue TAB Strom">Ab dem 01.10.2008 neue TAB Strom</a></h2>
					<span class="postmeta">

						<span class="postmeta_date">14. Oktober 2008</span>
						<span class="postmeta_author"><a href="mailto:jantz@sw-or.de">Anne-Kathrin Jantz</a></span>
						<span class="postmeta_kategorie"><a href="#" title="Alle Artikel in Gesetzesänderungen ansehen" rel="category">Gesetzesänderungen</a></span>
						<span class="postmeta_kommentar"><a href="#" title="Kommentiere Ab dem 01.10.2008 neue TAB Strom">3 Kommentare</a></span>
					</span>
				</div></div>   </div></div>

</body>
</html>
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Geändert von andir (29.10.2008 um 10:13 Uhr) Grund: Edit 2: IE 7 hinzugefügt
Mit Zitat antworten