Ankündigung

Einklappen
Keine Ankündigung bisher.

Abstände nach Textformatierung

Einklappen

Neue Werbung 2019

Einklappen
X
Einklappen
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige Weiter
  • #1

    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
    "Ein Script ist nur dann gut, wenn es unabhängig von der verwendeten Plattform funktioniert"
    Stichworte: -
  • #2
    ä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

    Kommentar

    • #3
      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

      Kommentar

      Vorherige Weiter
      Lädt...
      X