• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Problem mit mit dem Abstand

Status
Für weitere Antworten geschlossen.
R

RedDrag

Guest
Hi,

ich bin gerade dabei eine Navi zu machen, aber ich bekomme es einfach nicht hin, dass die Menüpunkte mit nur einem kleinen Abstand, untereinander liegen

Navi HTML-Code:
Code:
<div id="div1">
<p ><a href="index.htm">Home</a></p>
<p ><a href="Member.htm">Member</a></p>
<p ><a href="Clanwars.htm">Clanwars</a></p>
<p ><a href="Downloads.htm">Downloads</a></p>
<p ><a href="Contact.htm">Contact</a></p>
</div>
Navi CSS-Code:
Code:
#div1 {float:left; width:10em; height:22em; margin:3em 0em 0em 4em; text-align:center; background-color:#000000;}
Ich hoffe ihr könnt mir helfen:???:.

---------
lg RD
 
Zuletzt bearbeitet von einem Moderator:
Dann verwende keine p-Tags, denn die sind für Absätze - nicht für Menüs gedacht. Machs lieber einer Auflistung:

Code:
<ul>
<li><a href="">Menü 1</a></li>
<li><a href="">Menü 2</a></li>
</ul>

Das kannst Du dann auch sehr einfach per CSS beeinflussen.
 
ja, aber dann hab ich ja die Punkte davor.

Irgendwie kleben die Links jetzt auch am rechten Rand dran und, wenn ich padding benutze, dann wendet der das nur auf die Hintergrundfarbe an.
 
okey gut, aber die dummen Links kleben immernoch an der rechten Seite:(:?
 
Kann man schwer etwas sagen dazu ohne Quellcode. Tippe aber mal drauf, dass entweder Innen- oder/und Außenabstand nicht stimmt.
 
Okey es klappt doch.
Jetzt noch eine Frage zum Schluss:
Firefox zeigt unter "Member" und unter "Downloads" einen schwarzen Strich an oder erzeugt einen Abstand. Warum? Wie kann ich das beheben?

HTML-Code:
Code:
    <title>Titel</title>

    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta http-equiv="conten-style-type" content="text/css"/>
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
    <meta name="generator" content="Webocton - Scriptly" />

    <link href="style.css" type="text/css" rel="stylesheet" />


</head>

<body>
<img style="margin:1px 19em 0px 19em" src="Clan_SfL_banner.jpg" border="3" alt="Sniper for Life"/>
<div id="div1">
<ul>
<li ><a href="index.htm">Home</a></li>
<li ><a href="Member.htm">Member</a></li>
<li ><a href="Clanwars.htm">Clanwars</a></li>
<li ><a href="Downloads.htm">Downloads</a></li>
<li ><a href="Contact.htm">Contact</a></li>
</ul>
</div>
<div id="div2"></div>
Betreffender CSS- Code:
Code:
body {background-image:url(Streifen2.bmp);}
a:link {font-style:normal; text-decoration:none; color:#000000; background-color:#006000; display: block; line-height: 1.4em;}
a:visited {font-style:normal; text-decoration:none; color:#000000; background-color:#006000; display: block; line-height: 1.4em;}
a:focus {font-style:normal; text-decoration:none; color:#000000; background-color:#009900; display:block;}
a:hover {font-style:normal; text-decoration:none; color:#000000; background-color:#009900; display:block;}
a:active {font-style:normal; text-decoration:none; color:#000000; background-color:#009900; display:block;}


#div1 {float:left; width:7em; height:22em; margin:2em 0em 0em 4em; text-align:center; background-color:#000000;}
li {list-style-type:none;}
 
Steht in deinem Quelltext <li > statt <li>? Wenn ja, dann solltest du das erst mal beheben. Vielleicht löst sich das Problem dann von selbst. :D
 
Ich kann das Phänomen mit dem von dir geposteten Code leider nicht nachbauen.
Verschwinden die mysteriösen Linien, wenn du die Angabe bei line-height änderst?
Ansonsten bleibt wohl nichts anderes übrig als nicht nur den "betreffenden" CSS-Code zu posten sondern den ganze oder -- noch besser -- einen Link zur Verfügung zu stellen.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben