billige html fragen

Joined
Aug 18, 2003
Messages
8,118
Points
350
huhu,

hab nen problem.

muss ne kleine seite machen und will durch ne tabelle links die navi und rechts den content trennen. allerdings rutscht dann die navi links immer in die vertikale mitte der spalte, was beschissen aussieht :D

gegenmittel?

sieht atm ca. so aus

<tr>
<td>navi</td>
<td>viel zu viel text ^^</td>
</tr>

weitere fragen werden folgen =)
 
in den td-tag der Navi ein valign=top einsetzen...

allerdings sind tabellen zum layouten absolut ungern gesehen, man macht sowas heute mit css :)
 
wenns nach der lehrerin ginge, würden wir frames nehmen, haben ja auch netterweise phase 5 zur verfügung gestellt bekommen ^^
 
frames und tabellen sind mist.
mach die nav mit ner ungeordneten liste und den content als div daneben
ansonsten lads hoch und links uns damit wir die am quelltext rumpfuschen können
 
frames und tabellen sind mist.

Das ist so nicht ganz korrekt. Sie sind Mittel zum Zweck. Ob und inwieweit man sie nutzen sollte, hängt von den Anforderungen ab. Systeme wie Vbulletin und diverse große CMS nutzen nicht umsonst Framelösungen im Backendbereich.

Wenn man allerdings nach den Richtlinien der WCG-Standards geht und die Usability so hoch wie möglich will, wird man an CSS-definierten Layouts nicht vorbeikommen. Dementsprechend wäre dann auch die ungeordnete Liste das semantisch korrekte Mittel für ein Menü.

Tipps dazu findest du bei www.css4you.de, www.selfhtml.org und www.thestyleworks.de

Falls du bei deiner Tabellenlösung bleiben willst, dann ist sorseses Vorschlag die Lösung des Problems.
 
Das ist so nicht ganz korrekt. Sie sind Mittel zum Zweck. Ob und inwieweit man sie nutzen sollte, hängt von den Anforderungen ab. Systeme wie Vbulletin und diverse große CMS nutzen nicht umsonst Framelösungen im Backendbereich.


eben und dort werden sie weniger aufgrund ihrer ästhetischen qualitäten sondern vielmehr aufgrund ihrer funktion benutzt, was den hauptsinn bei der ganzen geschichte ausmacht.
 
von einer <ul> </ul> würde ich absehen, da die werte:

list-style-position, margin und padding nicht gerade die gleiche voreinstellung in allen browsern besitzen.

eher würde ich empfehlen einen der Div-Box einen name und eine formatierung für enthaltende Link zu geben und zusätzlich Span-Felder innerhalb dieser Div-Box zusätzlich designen, um Überschriften von Links anders zu formatieren.

hier ein beispiel:

HTML:
<style type="text/css">

  .navi a {
  color: #999;
  text-decoration:none;
  
  }
  
  .navi span {
  color: #666;
  font-weight:bold;
  }
</style>

<div class="navi">
  <span>
    Überschrift
  </span>
  <br />
  <a href="">
    LINK
  </a>
  <br />
  <a href="">
    LINK
  </a>
  <br />
  <a href="">
    LINK
  </a>
  <br />
</div>

udn für dein projekt bauen wir noch ein float:left in die CSS-Deklarierung der Navi-Div rein ( damit können wir 2 divs "nebeneinander" positionieren. dies ist zwar nicht ganz korrekt, da float etwas anders funktioniert, aber das ergebnis interessiert und ja erstmla ;) ). wichtig ist, das der teil, der per float eingesetzt wurde oben steht, da dies zuerst aufgeführt werden muss :)
den abstand der content box von der navi box realisierst du per "margin-left" aber achtung, ist der wer zu klein überschneiden sich die boxen, dies liegt daran das float halt etwas anders arbeitet. ( ich hab noch nen kleinen rahmen drum gezogen ;) )

so:

HTML:
<style type="text/css">

  .navi {
  float:left;
  border:1px solid #000;d
  }

  .navi a {
  color: #999;
  text-decoration:none;
  
  }
  
  .navi span {
  color: #666;
  font-weight:bold;
  }
  
  .content {
  margin-left:100px;
  border:1px solid #000;
  }
</style>
<div class="navi">
  <span>
    Überschrift
  </span>
  <br />
  <a href="">
    LINK
  </a>
  <br />
  <a href="">
    LINK
  </a>
  <br />
  <a href="">
    LINK
  </a>
  <br />
</div>
<div class="content">
  ICH WILL CONTENT SEIN !!!!!!!
</div>

wenn du später unter dem ganzen noch eine footer box packen willst deklariere diese einfach mit

clear:both in css bzw style="clear:both;" als attribut in der jeweiligen DIV-Box

//EDIT

der gebrauch von Frames ist nur üblich, wenn man kein Templatesystem hat und ungern 1miomal seine navi und den ganzen rest in anderen seiten einbauen möchte ( was möglice änderungen ja nicht gerade erleichtern würde ), oder man content hat der nicht umbedingt neu geladen werden muss.

in zeiten von templatsystemen und ajax ist dies jedoch nur noch sehr bedingt zu gebrauchen.

und tabellen sollte man nur nutzen wenn man tabellen hat, wie in einem forum zb :o

achja, solltest du bei einem tabellen design bleiben und kein css nutzen :disgusted

dann bitte so:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <title> </title>
</head>
<body>
<table style="table-layout:fixed;border-style:none">
  <tr>
    <td style="vertical-align:top;width:25%;"> </td>
    <td style="width:75%;"> </td>
  </tr>
</table>
</body>
</html>

wenn du willst erklär ich dir auch was was ist, oder lies dir einfach unter http://de.selfhtml.org/ den bereich HTML sowie CSS durch, dann weißt du alles was du wissen musst :)
 
Last edited:
der gebrauch von Frames ist nur üblich, wenn man kein Templatesystem hat und ungern 1miomal seine navi und den ganzen rest in anderen seiten einbauen möchte

:? Ich bin eher der Meinung, dass es sich um Performancegründe handelt. Wenn man im Backendbereich, wie bei CMS (die allesamt per Templates arbeiten) üblich, eine ganze Menge Funktionen (Menupunkte) bereitstellt, die dann auch noch per SQL geladen werden und via JS auf und zuklappen, dann würde jede kleine Änderung im Contentbereich bedeuten, dass auch das Menu mit allem Drum&Dran wieder neu geladen würde. Das kostet einfach Zeit. Daher werden die Menus in Frames ausgelagert.

Mit ul-Listen hatte ich bis dato keine großen Probleme in den 3 Standardbrowsern (Opera, FF, IE). Sollten doch Minimalabweichungen auftreten, kann man sich den Conditional Comments bedienen.
 
hättest du alles geqoutet wäre dir aufgefallen, dass ich ebenfalls darauf hinweise ;)

oder man content hat der nicht umbedingt neu geladen werden muss.

ka wie es jetzt beim ie7 ist, aber 6 zu safari zu ff zu opera war nicht gleich ...
 
Back
Top Bottom