Aufteilung meiner Website

Tikonteroga

Hallo,

ich stehe beim erstellen meiner Seite vor folgendem Problem.

Ich habe ein <div> Element mit width:800px (höhe weiss ich noch nicht) und möchte es in die folgenden drei Bereiche aufteilen.

width:128px (Submenu)
width:512px, margin-left:16px, margin-right:16px (Site)
width:128px (weiss noch nicht)

Also: 128 + 16 + 512 + 16 + 128 = 800

Was wäre in diesem Fall die beste Vorgehensweise? Wäre es sinnvoll die drei Bereiche, da sie nebeneinander liegen sollen, jeweils in ein Inline-Element <span> zu "verbacken"?

Dann würde das so aussehen.

Ich habe mir auch überlegt es mit eine Tabelle zu realisieren. Aber Tabellen benutze ich nur ungerne ...

Gruß

Tikonteroga

phore

hallo.

Zitat

Was wäre in diesem Fall die beste Vorgehensweise? Wäre es sinnvoll die drei Bereiche, da sie nebeneinander liegen sollen, jeweils in ein Inline-Element <span> zu "verbacken"?

nein, geht besser und einfacher mit float:

beispiel html:

Code

<div id="page">
  <div id="submenu">
    <ul>
      [*]submenu punkt 1
      [*]submenu punkt 2
    [/list]
  </div>
  <div id="weiss_noch_nicht">



was?</p>
  </div>
  <div id="content">



adfasf</p>
  </div>
</div>

Alles anzeigen

beispiel css:

Code

div#page {
  width: 800px;
}
#submenu {
  width: 128px;
  float: left;
}
#content {
  width: 512px;
  margin: 0px 16px 0px 16px;
}
#weiss_noch_nicht {
  width: 128px;
  float: right;
}

Alles anzeigen

wird wohl noch nicht perfekt sein, kanns grad nicht testen, aber mit der vorlage solltest du es schaffen - ansonsten meldest du dich nochmal.
so long

mgraf

Nö, wieso, pack einfach alle in DIVs.
Spans sind eher für Text-Bausteine geeignet, als für Layout-Elemente.

Versuch mal dieses Bsp. hier...

PS, achte auf den Titel

Tikonteroga

Hallo,

ich habe es jetzt hinbekommen. Funzt im IE7 und Firefox 2.0.

CSS:

Code

div.content, div.submenue, div.site, div.special
{
	height:480px;
}
div.submenue, div.site, div.special
{
	display:inline;
	float:left;
}
div.content
{
	width:800px;
}
div.submenue, div.special
{
	width:128px;
}
div.site
{
	width:512px;
	margin:0px 16px 0px 16px;
}

Alles anzeigen

HTML:

Code

<div class="content">
	<div class="submenue"></div>
	<div class="site"></div>
	<div class="special"></div>
</div>

Ihr verwendet oft das HTML Atribut id an der Stelle an der ich das Atribut class verwenden, muss mir das mit dem id mal anschauen.

Gruß

Tikonteroga

phore

ist im prinzip ähnlich, id hat etwas mehr "autorität".. wenns mit class nicht funzt kannst du es mal mit id probieren. bei id darf das mit id versehene element nur 1x in der entsprechenden datei vorkommen.
ich verwende id für sachen wie layout divs und class für p, span, links usw.

so long

Tags