Abstände nach Textformatierung

GSJLink · 18.12.2005, 11:45

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

DER_Brain · 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

Basti · 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

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Textformatierung im Script		PHP Tipps 2005-2	10	17.10.2005 21:56
Funktion - Textformatierung beibehalten?	patr1k	PHP Tipps 2005-2	6	13.08.2005 02:29
Textformatierung für einzelne Variablen?		PHP Tipps 2005-2	20	22.07.2005 09:16
Textformatierung auslesen		PHP Tipps 2005	11	13.04.2005 19:35
Kann man Textformatierung erhalten?		PHP Tipps 2005	3	29.03.2005 13:09
[Erledigt] document.getElementById + Textformatierung		HTML, Usability und Barrierefreiheit	4	18.01.2005 19:44


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

18.12.2005, 11:58
DER_Brain Erfahrener Benutzer Registriert seit: 18.04.2005 Beiträge: 1.541 PHP-Kenntnisse: Fortgeschritten	ä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

18.12.2005, 12:29
Basti Erfahrener Benutzer Registriert seit: 18.07.2004 Beiträge: 2.162 PHP-Kenntnisse: Fortgeschritten	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