CSS - jeder Browser zeigts anders an, aber keiner richtig

fanrpg · Beitrag von **fanrpg** » 17.06.2006 14:43

Irgendwie verstehe ich die Welt gerade nicht mehr

Ich will ein zweispaltiges Design haben üben drüber ein Teil für Banner und so nen Krams und da drunter eine linke Spalte mit einer Breite von 15% oder ersatzmässig 150px. und der rechte spalte soll demnach 85% oder den Rest haben.
Aber entweder zieht der Browser die linke Spalte bis zur Mitte oder nur so gross wie die Tabelle von der Navigation dabei soll die genauso breit sein wie die Navigationsspalte sprich ein width von 100%, aber das nimmt auch kein Browser richtig an nur der FireFox aber der zieht gleichzeitig die linke Spalte bis zu Hälfte des Bildschirms

Hier mal die Seite: http://www.gothic.fanrpg.com/neue-seite/
Und hier mal der Code: http://www.fanrpg.com/code.php?id=7

Aber irgendwie zeigt das kein Browser so an wie ich das haben will (getestet mit IE, Opera und Firefox) obwohl ich nicht verstehe warum, weiss einer von euch vllt. warum?

Spezial · Beitrag von **Spezial** » 17.06.2006 15:04

http://www.css4you.de/wslayout1/ex0009.html
Auf Basis dieser Seite solltest du was hinkriegen...
Musst einfach nur alles ein bisschen verändern. Auf dieser Basis habe ich auch meine Site gemacht: www.planet-spezial.de

edit:
hab da mal was gebastelt...in wiefern das mit deinen vorstellungen übereintrifft weiß ich nicht

müssteste dann selber so machen wie de es genau haben willst.

Code: Alles auswählen

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>titel</title>
</head>
<style type="text/css">
body 
{
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size:10px;
 background-color:#000000;
 color:#FFFFFF;
 text-align:center;
 margin:0px;
}

#title {
 height:100px;
 padding:0px;
}
#left {
 width:15%;
 float:left;
}

.menucontainer {
 border:#000000 2px solid;
background-color:#666666;
 border-top:none;
 width:100%;
 margin:1px;
 float:left;
 text-align:justify;
}
.contentcontainer {
 border:#000000 2px solid;
background-color:#666666;
 border-top:none;
 width:83%;
 margin:1px;
 float:right;
 text-align:justify;
}
.titleline{
 height:14px;
 width:100%;
 border-bottom:#000000 2px solid;
 background-color:#999999;
 font-size:12px;
 font-weight:bold;
 text-align:center;
 text-valign:center;
 margin:0px;
 padding:3px 0px;
}
</style>
<body bgcolor="#000000">

<div style="width:100%; margin:5px auto; text-align:left;">
 <div id="title">
 
  hier kommt der banner rein. die <b>height</b> von #title muss der höhe des banners entsprechen
  
 </div>

 <div id="left">
 
  <div class="menucontainer">
   <p class="titleline">Menu</p>
   <p class="content">
   link 1<br />
   link 2<br />
   link 3<br />
   link 4<br />
   </p>
  </div>
 
 </div>



 <div class="contentcontainer">
  <p class="titleline">Titel - optional</p>
  <p class="content">
  
  hier kommt der inhalt rein
  
  </p>
 </div>

</div>

</body>
</html>

</body>
</html>

Beitrag von **S2B** » 17.06.2006 17:43

Die Tabellenmethode sollte aber auch ohne Probleme klappen (auch wenn ich natürlich mal wieder für die div-Methode bin *g*):

Code: Alles auswählen

<table style="width: 100%; border-spacing: 0px">
  <tr>
    <td colspan="2">Banner</td>
  </tr>
  <tr>
    <td style="width: 150px">Menü</td>
    <td>Content</td>
  </tr>
</table>

Spezial · Beitrag von **Spezial** » 17.06.2006 19:14

S2B hat geschrieben:Die Tabellenmethode sollte aber auch ohne Probleme klappen (auch wenn ich natürlich mal wieder für die div-Methode bin *g*):

div ist einfach schöner

Beitrag von **S2B** » 18.06.2006 00:00

Spezial hat geschrieben:div ist einfach schöner

Jep.

fanrpg · Beitrag von **fanrpg** » 18.06.2006 00:12

S2B hat geschrieben:
Spezial hat geschrieben:div ist einfach schöner
Jep.

Finde ich persönlich nicht.
Tabellen haben schon ihre Vorteile vor allem das man meistens davon ausgehen kann das es in jedem Browser gleich angezeigt wird.

Beitrag von **S2B** » 18.06.2006 00:42

Klar haben Tabellen ihre Vorteile, aber wenn das alle sagen, setzt sich der Standard nie durch und wir bekommen kein XHTML2 oder CSS3.

Funktioniert eigentlich mein Tabellen-Code bei dir?

Spezial · Beitrag von **Spezial** » 18.06.2006 14:15

fanrpg hat geschrieben:Finde ich persönlich nicht.
Tabellen haben schon ihre Vorteile vor allem das man meistens davon ausgehen kann das es in jedem Browser gleich angezeigt wird.

Tabellen sind aber eigentlich garnicht für die Grundlage von Designs ausgelegt, da man mit CSS die gleichen, sogar noch mehr Möglichkeiten hat.
CSS ist allerdings auch eher was für Fortgeschrittene finde ich. So wie ich jetzt meine Site habe, hätte ich sie früher niemals hingekriegt, deswegen war ich erst bei Tabellen, habe mittlerweile aber eingesehen, dass CSS viel schöner ist (vom Quelltext her, viel übersichtlicher, kompakter etc.

)
Aber mach wie du meinst, jedem das seine