kostenloser Webspace werbefrei: lima-city

Problem mit XHTML/CSS

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   a*****e

   15:19, 15.5.2008

   Moin,
   
   ich versuche gerade vorbildlich zu sein und ein Design mit XHTML/CSS zu slicen. Leider macht mir das immer wieder Probleme, bin sehr unerfahren und ich bin schon fast versucht wieder Tabellen zu nehmen, aber nun zum eigentlichen Thema. Eigentlich ist alles Perfekt in Opera, Safari und Firefox, nur rechts am Rand sind 4-5 Pixel frei (1024x768), was aber nicht sein dürfte, denn die Bild Datei hat keine Ränder.
   
   So sieht das jetzt aus:
   http://arthune.lima-city.de/designs/sxtls/
   So sollte das aussehen:
   http://arthune.lima-city.de/designs/sxtls/preview3.png
   
   So sieht der Code aus:
   

   body {
   background-color: #3F0907;
   margin: 0px;
   padding: 0px;
   }
   
   div#rahmen {
   width:1000px;
   }
   
   div#header1 {
   margin: 0px;
   background-image: url(pics/header1.png);
   width: 1000px;
   height: 101px;
   }
   
   div#header2 {
   background-image: url(pics/header2.png);
   width: 349px;
   height: 47px;
   float:left;
   margin:0px;
   }
   
   div#mnavi {
   background-image: url(pics/mnavi.png);
   height: 47px;
   width: 651px;
   float: right;
   }
   
   div#header3 {
   background-image: url(pics/header3.png);
   float:left;
   width: 248px;
   height: 39px;
   }
   
   div#snavi {
   background-image: url(pics/snavi.png);
   height: 39px;
   width:752px;
   float: right;
   }
   
   div#lseite {
   background-color: #460505;
   width: 225px;
   height: 1000px;;
   float: left;
   }
   
   div#rseite {
   background-color: #561010;
   width: 225px;
   height: 1000px;;
   float: right;
   }

   
   
   Kann mir vielleicht jemand helfen? Wäre echt nett!
   
   mfg,
   Xalvi
   
   
   Beitrag geändert: 15.5.2008 15:19:37 von arthune

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. b*******h

   15:22, 15.5.2008

   1. ma nettes Design, gefällt mir!
   
   Nur leider seh ich an den Rändern keinen Unterschied bei den Bildern...nu das bei einem nach dem Kopfteil alles fehlt und die Farbe in dem Logo anders is

4. ryanblack

   

   ryanblack hat kostenlosen Webspace.

   15:39, 15.5.2008

   Richtig gelungen ist das Markup aber nicht... so viele <div>s ! Typisch Tabellenlayoutdesigner, der versucht CSS Layouts zu erstellen.
   
   back to topic:
   
   Ich sehe da keine Ränder. Vll meinst du nur die Hintergrundfarbe, die nicht von dem Hintergrundbild (1000px breit) verdeckt wurde (http://ryanblack.lima-city.de/yaiu/p/103523799-1335996387.png)?
   
   Ryan
   
   
   Beitrag geändert: 15.5.2008 15:40:07 von ryanblack
5. Autor dieses Themas

   a*****e

   16:00, 15.5.2008

   Ach... so sieht das auf höheren Einstellungen also aus. :P Warum ist die Page denn rechtsbündig?
   
   @ryan: Was ist an dem Code denn schlecht? Hilf mir doch lieber statt zu meckern, wie gesagt, bin Anfänger.

6. ryanblack

   

   ryanblack hat kostenlosen Webspace.

   16:21, 15.5.2008

   
   Ach... so sieht das auf höheren Einstellungen also aus. :P Warum ist die Page denn rechtsbündig?
   
   @ryan: Was ist an dem Code denn schlecht? Hilf mir doch lieber statt zu meckern, wie gesagt, bin Anfänger.
   

   
   \"Warum ist die Page denn rechtsbündig?\"
   
   (Du meinst wohl linksbündig...) Weil du es nicht anders gemacht hast? Wenn du #rahmen die Breite 1000px zuweist, kann ich auch nichts dafür und der Browser setzt normalerweise die <div>s links hin. Du kannst es auch zentriert machen.
   
   Was an deinem Code schlecht ist? Wie ich schon sagte, zu viele <div>s. <div> steht für division, was Aufteilung bedeutet. Da XHTML dafür da ist, den Inhalt zu beschreiben (nicht das Aussehen), wird <div>s benutzt, um den Inhalt aufzuteilen. Was du gemacht hast: statt <img />s einfach <div>s + Hintergrundbild + Breite + Höhe.
   
   Verschaff dir erst mal Informationen, wie man CSS Layouts in Zusammenhang mit XHTML erstellt.
   
   Ryan
   
   (Und bitte, BITTE: <?xml version=\"1.0\" ?> in Zeile 1 ist völlig unnötig! Es verschafft nur weitere IE 6- Rendering Bugs.)
   
   Beitrag geändert: 15.5.2008 16:22:57 von ryanblack

7. malia

   Moderator

   malia hat kostenlosen Webspace.

   17:24, 15.5.2008

   
   
   

   
   
   Verschaff dir erst mal Informationen, wie man CSS Layouts in Zusammenhang mit XHTML erstellt.
   
   Ryan
   
   

   
   
   Das versucht er doch gerade, ich finde es nicht besonders nett, jemandem der Hilfe sucht so eine Antwort zu erteilen, das entmutigt doch total.Er betont ja ausdrücklich, dass er Anfänger ist.
   
   Grüsse Malia

8. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?