Webseite mit div container wird im IE nicht richtig dargestellt
bearbeitet von
die Bereiche nav und head sind position:relative damit sie untereinander aufgebaut werden
> Hallo,
>
> vielen Dank erst mal für das Feedback!
> Die festen Höhen und Breiten Angaben habe ich verwendet damit der Inhalt in dem Hintergrundbild (Rahmen) bleibt, oder ist das nicht sinnvoll, bzw. ist es möglich den Rahmen auch über Codezeilen nachzubilden?
>
> Eine andere Sache die mir noch Sorgen bereitet: wie schaffe ich es dass die Links im Main Bereich geöffnet werden?
>
>
>
> > Hi,
> >
> > > Gut hab das Grundgerüst soweit fertig
> >
> > najaaa ...
> >
> > Du deklarierst laut DOCTYPE XHTML 1.1 - warum? Es gibt IMO nur wenige Fälle, in denen das sinnvoll ist. Sinnvoller wäre XHTML 1.0 (Strict), HTML 4.01 oder eben zeitgemäß HTML 5. Wenn letzteres, dann könntest du auch einige der div-Elemente durch passendere aud damit aussagekräftigere Elemente austauschen. Zum Beispiel _header_ anstatt div#head, _nav_ anstatt div#nav und _main_ anstatt div#main. Wenn du **wirklich** XHTML nehmen wolltest, wäre auch das Logo-Bild fehlerhaft, weil das img-Element nicht geschlossen ist.
> >
> > Du setzt viele überflüssige div-Container ein. Zum Beispiel div#logo und div#adresse. Die beiden haben jeweils nur ein einziges Kindelement, gruppieren also nichts und sind somit unnötig. Die ID, die du vermutlich brauchst, um das Element mit CSS selektieren zu können, kannst du ebensogut dem img- bzw. dem h1-Element geben.
> >
> > Die Navigation ist Unfug: Alle Links in ein h2-Element? Nein. Die Links bilden doch keine Überschrift. Das h2-Element könnte aber eine Gesamtüberschrift der Navigationsleiste sein. Wenn du sowas nicht haben möchtest - weg damit. Die Links könnte man als Liste auszeichnen. Muss man nicht, ist aber gängige Praxis. Für mich käme also sowas in der Art heraus (die meta-Elemente habe ich mal weggelassen, dafür eines ergänzt, das die Zeichencodierung angibt):
> >
> > ~~~html
> > <!DOCTYPE html>
> > <html lang="de">
> > <head>
> > <meta charset="utf-8">
> > <title>bisbee Teppichhandel Hüxstraße 38, 23552 Lübeck</title>
> > <link href="style.css" rel="stylesheet" type="text/css">
> > </head>
> >
> > <body>
> > <header>
> > <img id="logo" src="images/bisbee.png" width="175" alt="logo">
> > <h1 id="adresse">GOLDMANN International Carpet Collection<br>bisbee (Hüxstr. 38, 23552 Lübeck Germany)</h1>
> > </header>
> >
> > <nav>
> > <h2>Platzhalter</h2>
> > <ul>
> > <li><a href="home.html">Home</a></li>
> > <li><a href="galery.html">Gallerie</a>/li>
> > <li><a href="collection.html">Sammlung</a>/li>
> > <li><a href="service.html">Service</a>/li>
> > <li><a href="about.html">Über uns</a>/li>
> > <li><a href="contact.html">Kontakt</a>/li>
> > <li><a href="links.html">Links</a>/li>
> > <li><a href="en/index.html" >EN</a>/li>
> > </ul>
> > </nav>
> >
> > <main>
> >
> > </main>
> > </body>
> > </html>
> > ~~~
> >
> > Schauen wir uns nun mal das Stylesheet an. Da sind eine Menge fester Breiten- und Höhenangaben in Pixel (px). Weg damit! Größen in px passen praktisch nie zum Browserfenster des Besuchers, und sie verhindern, dass die Seite sauber mit der Größe mitskaliert. Auch Schriftgrößen in px sind eine schlechte Idee, verwende besser Prozent oder em.
> >
> > Einige Elemente hast du mit position:relative versehen - vermutlich weißt du selbst nicht, warum. Ebenfalls weg damit. So, und dann sehen wir weiter.
> >
> > So long,
> > Martin
> > --
> > Nothing travels faster than the speed of light with the possible exception of bad news, which obeys its own special laws.
> > - Douglas Adams, The Hitchhiker's Guide To The Galaxy