Darstellungsproblem Firefox und Internet Explorer 8

Darstellungsproblem Firefox und Internet Explorer 8

Beitragvon ltd.lupo » 25.01.2010, 15:40

Hallo

Ich bin neu hier und habe natürlich ein Problem bezüglich Darstellung einer Internetseite im Firefox und InternetExplorer.

Folgendes Problem: Screenshot Firefox, Text und Bild (in meinem Fall eine Flash Animation befinden sich im div.two-cols-content, der Text wird über die content p innerhalb der div.two-cols#content mit einer Breite von 420px in der css definiert. Im Firefox und Opera wird alles richtig dargestellt.

http://www.id31.de/screenshots/firefox.jpg

Und hier der Screenshot im Internet Explorer8.

Hier wird der Text ganz nach links geschoben :( , ich kann den Fehler nicht finden.

http://www.id31.de/screenshots/internetexplorer8.jpg

Hier einmal meine css. Datei:
Code: Alles auswählen
body {
   padding: 0px;
   margin: 0px;
   text-align: center;
   background: #FFFFFF;
   height: 100%;
   font-family: Verdana, Arial, Helvetica, sans-serif;
}

a {
   color: #000000;
}
a:hover {
   color: #666666;
}

a img {
   border:none;
}

#all {
   padding:0;
    width:997px;
   height: 100%;
   margin: 0px auto 0px auto;
}



td {
font-size:11px;
}

td a {
margin:5px;
}

td a:hover {
text-decoration:none;
}

#header {
   clear:both;
   margin:0 0 0 0;
   padding:0;
   text-align:left;
}

#logo {
   width: 773px;
   margin: 0;
   padding:0;
}

h1#headline span {
   display: none;
   margin: 0px;
}

#right {
  width:179px;
  padding-bottom:30px;
  float:right;
  text-align:left;
}

#sub_nav {
   border-top: 1px solid #FFFFFF;
   width: 179px;
   height: 250px;
   text-align: left;
   /*background: url(main_FILES/vert_line.gif) repeat-y right;*/
   float: left;
   margin:0;
   padding:0;
}

#sub_nav_content {
   position:absolute;
   top:160px;
   /*background: url(main_FILES/sub_nav_header.gif) no-repeat;*/
}

#sub_nav_content h3,
#right h3 {
   font-size:12px;
   margin:0 0 0 16px;
   padding:16px 0 0 0;
   margin-bottom:16px;
}

#sub_nav_content h3 a,
#right a {
text-decoration:none;
}

div[id="sub_nav_content"]>h3, {
   margin:0 0 16px 0 !important;
   padding:16px 0 0 10px !important;
}

#content {
   text-align: left;
   font-family: Verdana, Arial, Helvetica, sans-serif;   
   padding-bottom:30px;
   min-height:400px;
}

#left_img {
   width:194px;
   height:246px;
   background-image: url(http://www.id31.de/typo3conf/ext/tmpl_001_soeasy2use/files/img/left_back.jpg);
   position:absolute;
   top:0px;
}

#sub_content {
   width:179px;
   padding-bottom:5px;
   background:#fff;
   position:absolute;
   top:110px;
}

#sub_content h1,
#right h1 {
   font-family: Geneva, Arial, Helvetica, sans-serif;
   font-size: 13px;
   color: #000;
   font-weight: bolder;
   margin: 0px 0px 10px 0px;
   padding-top:15px;
   padding-bottom:15px;
   padding-left:5px;   
}
#sub_content h1{
/*background:#F4F4F3 url(main_FILES/sub_nav_header.gif) no-repeat;*/
}

#sub_content p,
#right p {
   margin-top: -4px;
   padding-left:5px;
}

#sub_content p, li,
#right p {
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 10px;
   line-height: 1.4em;
   color: #333333;
}

#content p {
   width:420px;
   /*margin: 10px 10px 10px 0;*/
   text-align:justify;
}

#content p, li {
   font-size: 11px;
   line-height: 20px;
   color: #333333;
}

#content li {
   background:url(main_FILES/arrow_left.gif) no-repeat left;
   padding-left:10px;
}

#content ul {
   list-style-type:none;
}

#content h1 {
   width:420px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #419AD6;
   font-weight: bold;
   margin: 0px 0px 20px 0px;
}

#content h2 {
   width:420px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
   color: #999999;
   line-height: 20px;
   margin: 0px 0px 20px 0px;
}

#content h3 {
   width:420px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   margin: 0px;
   color: #333333;
}

div#footer {
   padding: 20px 0px 10px 3px;
   font-size: 10px;
   line-height: 10px;
   margin: 20px 20px;
   background:url(main_FILES/hori_line.gif) repeat-x top;
}

div#footer ul {
   clear: both;
   list-style-type: none;
   margin: 0px;
   padding: 0px;
}

div#footer ul li {
   display: block;
   float: left;
   padding-: 5px;
   line-height: 15px;
   color:#419AD6;
}

div#footer ul li span a {
   color: #000000;
   text-decoration: none;
   padding-: 5px;
   font-size: 10px;
}

div#footer ul li span a:hover {
   color: #666666;
}

div#footer ul .testList {
   padding: 0px;
}


/*##################  PopUp Menü Start ######################*/

#navi {
width:800px;
float: right;
padding-top:3px;
padding-bottom:4px;
}

.top_level_1 a, .top_level_2 a, .top_level_3 a {
text-decoration:none;
font-size:11px;
}

.top_level_1 {
padding:0px;
width:129px;
text-align:center;
}

.top_level_2 {
text-align:left;
padding:0px;
}

.top_level_3 {
text-align:left;
padding:0px;
}
/*###################### PopUp Menü Ende ###############################*/
/*################################## sub_nav #######################################*/
#sub_nav_content ul {
   list-style-type: none;
   margin: 0px;
   padding: 0px;
}
#sub_nav_content ul li {
   /*background-image: url(main_FILES/arrow_left.gif);
   background-repeat: no-repeat;
   background-position: 8px 10px;*/
}
#sub_nav_content ul li span {
   display: block;
   line-height: 25px;
   /*background-image: url(main_FILES/hori_line.gif);
   background-repeat: repeat-x;
   background-position: bottom;*/
}
#sub_nav_content ul li span a {
   padding:0 5px 0 10px;
   display: block;
   line-height: 29px;
   border: #FFFFFF 1px solid;
   background-color: #f3f3f3;
   text-decoration: none;
   color: #666666;
}

#sub_nav_content ul li span a:hover {
   background-color: #FFFFFF;
   border: #419ad6 1px solid;
   width: auto;
}

#sub_nav_content #current a {
   font-weight:normal;
   background-color: #FFFFFF;
   border: #419ad6 1px solid;
}

#sub_nav_content ul li ul li span a {
   padding-left: 10px;
   display: block;
   line-height: 24px;
   height: 23px;
   width: 178px;
   text-decoration: none;
   color: #000000;
    font-weight:normal !important;
}

#sub_nav_content ul li ul li {
   background: none;
}

#sub_nav_content .lev_2 li {
background: none;
}

#sub_nav_content .lev_2 li a {
padding-left:15px;
font-size:10px;
line-height: 20px;
}

@media screen and (min-width: 550px){
#header {
padding:0 !important;
margin:1px 0 0 0 !important;
}
#top_nav {
margin-bottom:-10px !important;
}

#sub_nav_content .lev_2 ul {
  margin-left:10px;
}

.tx-dropdownsitemap-pi1 ol {
  margin:0 !important;
  padding:0 !important;
}

.tx-dropdownsitemap-pi1 li {
  background:none !important;
  margin:0 !important;
  padding:0 !important;
}

.tx-dropdownsitemap-pi1 div {
  margin-left:10px !important;
}

.three-cols {
  margin: 20px 200px 100px 200px !important;
  /*background:url(main_FILES/vert_line.gif) repeat-y ;*/
}

.two-cols {
  margin: 20px 20px 100px 200px !important;
  background:none;
}


Wer kann mir helfen?

Ltd.Lupo
ltd.lupo
neu hier
 
Beiträge: 1
Registriert: 25.01.2010, 15:28

Re: Darstellungsproblem Firefox und Internet Explorer 8

Beitragvon sejuma » 25.01.2010, 20:04

Hat deine Seite einen Doctype?
Ist der HTML-Quelltext valide?
Anhand von Grafiken kann man keine Fehlerursachen erkennen. Ein Link zur Seite wäre deshalb hilfreicher.
Bild
sejuma
Vielposter
 
Beiträge: 805
Registriert: 15.07.2009, 17:46


Moderatoren: Laus, Moderatoren

Ähnliche Beiträge zu "Darstellungsproblem Firefox und Internet Explorer 8"

Zurück zu: CSS für Anfänger

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast