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

vertikaler abstand bei <hr>

Status
Für weitere Antworten geschlossen.

nemelio

Neues Mitglied
hallo, ich komme hier gerade nicht mehr weiter, möchte 5 linien untereinander haben die einen abstand von 1px haben und selbst auch nur 1px breit sind.

ich habe es nun mit hilfe von google soweit hinbekommen:

HTML:
<html>
<head>
<style type="text/css">
 hr.line {
 color: #000000;
 width: 100%;
 margin: 1px auto;
 height: 1px;
 }
</style>
</head>
<body>
 <hr class="line">
 <hr class="line">
 <hr class="line">
</body>
</html>

die linien sind jetzt zwar schön schwarz und auch nur 1px breit aber haben immer noch einen riesigen abstand zueinander.

weiß hier vieleicht jemand abhilfe bei diesem problem ?
 
Abgesehen davon, dass fünfmal <hr> untereinander ziemlich umständlich und nicht sehr sinnvoll ist (ich würde einfach ein Hintergrundbild mit fünf Streifen nehmen), fehlen wahrscheinlich im css-Bereich Angaben zu padding und line-height. Diese musst du, vermute ich, auf 0 bzw. 2px reduzieren.
Aber nimm besser einfach ein Hintergrundbild -- das ist viel einfacher!
 
hallo, danke für die antwort.

habe gerade deinen tip mit dem padding getestet, es hat sich jedoch nichts verändert.

ein hintergrundbild ist in diesem fall leider nicht möglich, kann für mein vorhaben keine bilder benutzen.

gibt es noch eine andere möglichkeit solche 5 linien zu machen ?
 
Ich habe den Eindruck, dass man den Abstand von hr nicht beeinflussen kann.
Als Hilfslösung würde ich vorschlagen, drei Div's zu verwenden (Efchen ist ja nicht da ;-) )
Den ersten beiden gibst du border-top und border-bottom mit 1px height und margin-top.
Den dritten lediglich ein border-top.

Ist sicher nicht elegant, aber den Zweck würde es erfüllen.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben