Abstände nach Textformatierung

GSJLink hat ein Thema erstellt Abstände nach Textformatierung.

18.12.2005, 11:45

Abstände nach Textformatierung

Hallo,
ich habe folgendes gebaut:

Code:

<head>
<link rel="stylesheet" type="text/css" media="screen" href="./inc/style.css" />
</head>
<body bgcolor="#000000">
<div id="nav">
<ul>
<li id="nav_top"><div id="menuheadtext">Main</div>[/list]
<ul>[*]<div id="menutext">Punkt 1</div>[*]<div id="menutext">Punkt 2</div>[*]<div id="menutext">Punkt 3</div>[*]<div id="menutext">Punkt 4</div>[*]<div id="menutext">Punkt 5</div>
<li id="nav_bottom">[/list]
</div>
</body>

Style:

Code:

#nav {
font-family: Arial, Helvetica, sans-serif;
margin:0;
padding:0;
margin-bottom:0px;
}
#menuheadtext {
margin-bottom:0px;
margin-top:3px;
margin-left:5px;
font-size:16px;
}
#menutext {
margin-bottom:0px;
margin-top:1px;
margin-left:10px;
}
#nav ul {
padding:0;
margin:0;
list-style-type:none;
}
#nav li {
margin-top:0px;
margin-bottom:0px;
background-image:url(../images/menulist.gif);
width:223px;
height:20px;
}
li#nav_top {
width:223px;
height:25px;
margin:0;
background-image:url(../images/menuheader3.gif);
}
li#nav_topopen {
width:223px;
height:25px;
margin:0;
background-image:url(../images/menuheader4.gif);
}
li#nav_bottom {
width:223px;
height:9px;
margin:0;
background-image:url(../images/menulistdown.gif);
background-repeat:no-repeat;
}

oder hier

Wenn ich die Textformatierung (Arial) rausnehme, sind die Abstände im IE weg, im Firefox sind sie sowieso da. Könnt ihr mir sagen, wie ich die komplett wegbekomme?

Gruß GSJLink

Stichworte: -

Basti antwortet

18.12.2005, 12:29
Hi.

Deine Auszeichnung an sich ist ziemlich merkwürdig.

Für meinen Geschmack wäre eher sowas hier korrekt:

Code:

<div id="nav"> <h2>Main</h2> <ul>[*]Punkt 1[*]<span class="current">Punkt 2</span>[*]Punkt 3[*]Punkt 4[*]Punkt 5[/list] </div>

Dann kannst du mit
#nav h2 die Überschrift definieren, mit
#nav ul die Liste, mit
#nav ul li die Punkte, mit
#nav ul li a die Links (display: block; width: ...em bzw. mit
#nav ul li span.current den "Nicht-Link" in der Navigation
Den Abstand nach unten bekommst du mit einem padding-top in #nav hin.

Guck mal z.B. hier:
http://css.maxdesign.com.au/listamatic
Der Muster-Quellcode dort hat für meinen Geschmack einige class-Angaben zuviel, da man ja eben die Elemente über deen Vorhandensein in #nav direkt ansprechen kann. Dort hast du auch eine Tabelle, für welche Browser welche Codes geeignet sind.

Basti
Einen Kommentar schreiben:
DER_Brain antwortet

18.12.2005, 11:58
ändere bitte mal
[*]<div id="menutext">Punkt 1</div>[*]<div id="menutext">Punkt 2</div>[*]<div id="menutext">Punkt 3</div>[*]<div id="menutext">Punkt 4</div>[*]<div id="menutext">Punkt 5</div>

in class="menutext" und mach in der css nen punkt ( . )statt der #

eine id soll nur einmal pro dokument vorkommen..

mfg
Andi
Einen Kommentar schreiben:

Ankündigung

Abstände nach Textformatierung

Neue Werbung 2019

Abstände nach Textformatierung

Einen Kommentar schreiben:

Einen Kommentar schreiben: