Office Forum
www.Office-Loesung.de
Access :: Excel :: Outlook :: PowerPoint :: Word :: Office :: Wieder Online ---> provisorisches Office Forum <-
CSS Layout anzeige Problem im IE8
zurück: Erste Spalte und erste Zeile beim scrollen fixieren weiter: Größenangabe mit width="xx%" geht nicht in Outlook Unbeantwortete Beiträge anzeigen
Neues Thema eröffnen   Neue Antwort erstellen     Status: Antwort Facebook-Likes Diese Seite Freunden empfehlen
Zu Browser-Favoriten hinzufügen
Autor Nachricht
Gast



Verfasst am:
04. Nov 2012, 17:30
Rufname:

CSS Layout anzeige Problem im IE8 - CSS Layout anzeige Problem im IE8

Nach oben
       

Hallo, ich stehe hier kurz vor einem Nervenzusammenbrich Sad. Ich finde die Fehler einfach nicht.

Vielleicht vorab:
Ich habe ein Design für eine Homepage gemacht welches mir im Firefox 16.0.2 und auch im Opera 11.0 so angezeigt wird wie ich es auch programmiert habe, jedoch nicht im im Internet Explorer.

Was funtioniert alles nicht?
Ich habe in meinem Banner ein Logo dies wird im IE nicht angezeigt.

HTML Code:
Code:
<div id='banner'>
   <li class='platzhalter'></li>
      <div id='banner'>
         <ul class='logo'>
            <div>
               <img src="design/logo.jpg" height="100" border="0" alt="wmc-computerdienst">
            </div>
         </ul>
         <ul class='button_ban'> 
            <li><a href="<?php echo $_SERVER['SCRIPT_NAME']; ?>?seite=seite1">seite1</a></li>
            <li><a href="<?php echo $_SERVER['SCRIPT_NAME']; ?>?seite=seite2">seite2</a><li>
         </ul>
            <div id='logoname'>Seitenname</div>
      </div>
</div>
CSS Code:
Code:
#logoname
   {
      color: white;
      text-align: left;
      font-family:Georgie;
      font-size: 0.9em;

   }   
#banner
   {
      width:945px;
      height:120px;
      background:black;
      margin-right: auto;
      margin-left: auto;
      text-align: center;
      color: #fff;
      font:bold 34px/100% Georgia, Helvetica, sans-serif;
      z-index:999;
      border-top-right-radius: 20px;
      border-bottom-right-radius: 0px;
      border-bottom-left-radius: 0px;
      border-top-left-radius: 20px;
      -moz-border-radius-topright: 20px;
      -moz-border-radius-bottomright: 0px;
      -moz-border-radius-bottomleft: 0px;
      -moz-border-radius-topleft: 20px;
      -webkit-border-top-right-radius: 20px;
      -webkit-border-bottom-right-radius: 0px;
      -webkit-border-bottom-left-radius: 0px;
      -webkit-border-top-left-radius: 20px;
   }

#banner  > ul.logo
   {
      list-style:inside none;
      padding:0;
      margin:0;
      float:left; /*Menü position*/   
      padding:0px 30px;
   }

#banner  > li.platzhalter
   {
      display:block;
      list-style:inside none;
      padding:5px;
      margin:0;
      position:relative;
   }
   
#banner  > ul.button_ban
   {
      list-style:inside none;
      padding:0;
      margin:0;
      float:right; /*Menü position*/
      margin-right: 40px;         /* rechts */
      margin-top: 2px;           /* oben */
      margin-bottom: 0px;       /* unten */
      margin-left: 0px;          /* links */
   }
   
#banner  > ul > li
   {
      list-style:inside none;
      padding:0;
      margin:0;
      float:left; /*Menü position*/
   }
#banner  > ul > li > a
   {
      outline:none;
      display:block;
      position:relative;
      padding:12px 10px;
      font:bold 12px/100% Arial, Helvetica, sans-serif;
      text-align:center;
      text-decoration:none;
      text-shadow:1px 1px 0 rgba(0,0,0, 0.4);
   }

#banner  ul li > ul li /*keine Punkte vor dem li*/
   {
      display:block;
      list-style:inside none;
      padding:0;
      margin:0;
      position:relative;
   }
   
#banner  > ul > li > a
   {
      border-right:0px solid #000;
      color:#fff;
   }
Weiterhin werden mir die Kanten nicht abgerundet dargestellt sondern ganz normal im Rechten winkel.

Ich habe auch das Gefühl, dass die Schriftgröße im IE etwas größer ist.
Ich weiß leider nicht woran es liegt. Ich konnte die Fehler bisher nicht finden und ich suche schon den ganzen Tag danach Sad.

Ich danke schon jetzt dem jenigen der mir bei der Fehlersuche behilflich ist.
womaninweb
(X)HTML und CSS Junkie


Verfasst am:
04. Nov 2012, 19:29
Rufname:
Wohnort: Aachen


AW: CSS Layout anzeige Problem im IE8 - AW: CSS Layout anzeige Problem im IE8

Nach oben
       

Hallo Gast,

bezüglich der runden Ecken im IE kann der Tipp von dieser Seite (CSS: Abgerundete Ecken im Internet Explorer) vielleicht hilfreich sein.

Was die Anzeige des Bildes angeht, so kann ich dem HTML-Code nicht so ganz folgen: Du eröffnest den div 'banner' und führst direkt danach ein li an, ohne ol oder ul. Ein Listenelement kann nur in einer Liste aufgeführt werden. Als nächstes eröffnest du ein ul, dort jedoch ist ein div enthalten, statt eines Listenelements. Außerdem ist die ID 'banner' zweimal vergeben: IDs sind immer einmalig. Brauchst du die Eigenschaften, die in deiner ID enthalten sind öfters, so solltest du eine class daraus machen, die kann beliebig oft verwendet werden. Kann sein, dass der IE daran schon scheitert.

Was die Textgröße angeht, so kann es sein, dass der IE eine andere Größe anzeigt. Zum einem rendert er anders als die anderen Browser, zum anderen hast du in deinem CSS unter der ID 'logoname' die Schriftgröße in em angegeben. Dies ist ein relativer Wert, der von einem Ausgangswert abhängig ist. Ist er nicht zu Beginn des Stylesheets angegeben, so wird von dem Standardwert des Browsers ausgegangen - in der Regel sind das 16 Pixel (meine ich jedenfalls). Zu beachten bei der Schriftgröße ist auch, ob in einem Elternelement bereits eine Größe angegeben wurde. Wird einem Kindelement eine relative (neue) Schriftgröße vergeben, so orientiert sich die (neue) Größe an der des Elternelements. Alles nicht so einfach .... Wink

Gruß,
womaninweb

_________________
Der Vorteil der Klugheit besteht darin, dass man sich dumm stellen kann. Das Gegenteil ist schon schwieriger.
Kurt Tucholsky
Gast



Verfasst am:
04. Nov 2012, 22:10
Rufname:

AW: CSS Layout anzeige Problem im IE8 - AW: CSS Layout anzeige Problem im IE8

Nach oben
       

Danke Womainweb,
Das Problem mit dem Bild hätte ich jetzt gelöst er zeigt es mir jetzt korrekt an.

Die abgerundeten Kanten bekomme ich allerdings nicht hin Sad
Ich habe mir die Datei border-radius.htc heruntergeladen und in das Stammverzeichnis gelegt in dem sich auch die index.php Datei sowie die.css Datei befindet.
Anschließend habe ich folgende erweiterung zu dem was in #banner steht hinzugefügt: behavior:url('/border-radius.htc');

Da dies keinen Erfolg gezeigt hat habe ich diese zeile auch in den body eingetragen aber auch da leider ohne Erfolg.
Den cache habe ich auch gelöscht.

Was mach eich falsch?
womaninweb
(X)HTML und CSS Junkie


Verfasst am:
05. Nov 2012, 11:49
Rufname:
Wohnort: Aachen

AW: CSS Layout anzeige Problem im IE8 - AW: CSS Layout anzeige Problem im IE8

Nach oben
       

Hallo Gast,

leider habe ich weder IE 8 noch IE 9 zum testen. Hast du denn auch die meta-Angabe im Head gemacht, wie in dem Artikel beschrieben?

Gruß,
womaninweb

_________________
Der Vorteil der Klugheit besteht darin, dass man sich dumm stellen kann. Das Gegenteil ist schon schwieriger.
Kurt Tucholsky
Gast



Verfasst am:
05. Nov 2012, 19:54
Rufname:


AW: CSS Layout anzeige Problem im IE8 - AW: CSS Layout anzeige Problem im IE8

Nach oben
       

Du hast kein IE? Benutzt du Unix? (Tuh nix mit Unix Wink )
Ja eingebunden habe ich es.
Code:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="X-UA-Compatible" content="IE=8">
ich weiß nicht genau ob "> oder "/>
deswegen habe ich beides hineingeschrieben aber es geht beides nicht.

Vielleicht gibt es hier noch jemand anderes der mit bei meinem Problem weiterhelfen kann?
Neues Thema eröffnen   Neue Antwort erstellen Alle Zeiten sind
GMT + 1 Stunde

Diese Seite Freunden empfehlen

Seite 1 von 1
Gehe zu:  
Du kannst Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum antworten.
Du kannst deine Beiträge in diesem Forum nicht bearbeiten.
Du kannst deine Beiträge in diesem Forum nicht löschen.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
Du kannst Dateien in diesem Forum nicht posten
Du kannst Dateien in diesem Forum herunterladen

Verwandte Themen
Forum / Themen   Antworten   Autor   Aufrufe   Letzter Beitrag 
Keine neuen Beiträge Wichtig: HTML & CSS Forum: Tutorial - Slider-Effekt mit CSS 0 maninweb 6838 13. Feb 2009, 17:27
maninweb Tutorial - Slider-Effekt mit CSS
Keine neuen Beiträge MS Expression Web Forum: CSS Dropdownmenü touchfähig machen 0 aquidan 90 16. März 2014, 14:25
aquidan CSS Dropdownmenü touchfähig machen
Keine neuen Beiträge HTML & CSS Forum: CSS Browser Compatibility Problem 1 frosenow 2243 19. Jul 2012, 09:30
PeterKarrenberger CSS Browser Compatibility Problem
Keine neuen Beiträge HTML & CSS Forum: CSS/HTML: Leere Fläche unterhalb der Tabellen 2 muhmaff 1738 26. Jun 2012, 18:25
muhmaff CSS/HTML: Leere Fläche unterhalb der Tabellen
Keine neuen Beiträge HTML & CSS Forum: CSS menü unterschiedlich groß 14 Gast 1869 15. Apr 2012, 19:43
Gast CSS menü unterschiedlich groß
Keine neuen Beiträge HTML & CSS Forum: Bildgröße in CSS ausgliedern 1 Gast 1179 05. Okt 2011, 12:06
womaninweb Bildgröße in CSS ausgliedern
Keine neuen Beiträge HTML & CSS Forum: CSS: ul horizontal im elternelement zentrieren 5 losgehts 2324 18. März 2011, 10:57
losgehts CSS: ul horizontal im elternelement zentrieren
Keine neuen Beiträge HTML & CSS Forum: CSS urheberrechtlich schützbar? 2 HermanZ 1813 01. Feb 2011, 11:59
HermanZ CSS urheberrechtlich schützbar?
Keine neuen Beiträge HTML & CSS Forum: .css formatvorlage für 3 internetseiten verwenden 5 onurk 1484 28. Jan 2011, 20:47
MartinPent .css formatvorlage für 3 internetseiten verwenden
Keine neuen Beiträge Frontpage Forum: Html layout, dass auf Access Datenbank zugreift 0 doda 1079 31. März 2009, 16:39
doda Html layout, dass auf Access Datenbank zugreift
Keine neuen Beiträge MS Expression Web Forum: Layout 1 topkick 460 17. Feb 2009, 18:55
Gast Layout
Keine neuen Beiträge Frontpage Forum: Falsche Anzeige von Rechtecken ohne Füllung & R. im Fir 7 SirMike 766 15. Feb 2009, 17:51
Gast Falsche Anzeige von Rechtecken ohne Füllung & R.  im Fir
 

----> Diese Seite Freunden empfehlen <------ Impressum - Besuchen Sie auch: Expression Web Forum