kostenloser Webspace werbefrei: lima-city

CSS underline Problem

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   snoo3

   

   snoo3 hat kostenlosen Webspace.

   22:39, 9.7.2009

   Hallo
   Brauche seit langem wieder einmal Hilfe in einer CSS Frage.
   
   Und zwar habe ich eine Überschrift h2 um 20px eingerückt und unterstrichen.
   

   h2 {
       text-indent: 20px;
       text-decoration: underline;
       }

   
   Das funktioniert auch alles soweit, jetzt möchte ich aber, dass die Unterstreichung schon vor dem Text beginnt. Also die 20px, um die der Text eingerückt wurden, sollen auch schon unterstrichen sein. Geht das irgendwie? Habe bei meiner Suche nichts gefunden.
   
   Hoffe ihr versteht was ich meine und könnt mir helfen.
   
   Gruss Snoo3

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. w******s

   23:00, 9.7.2009

   h2 {
       text-indent: 20px;
       border-bottom: 1px solid;
       }

   
   Edit:
   Argh. Sorry, gerade nochmal nachgedacht. Das war nicht ganz richtig. Du willst ja nicht eine Linie, die komplett durchgezogen ist. Daher ist es etwas schwieriger.
   
   Das wäre denkbar
   

   h2 {
       padding: 0 0 0 20px;
       border-bottom: 2px solid;
       display:inline;
       }

   
   Allerdings wurde jetzt daraus ein Inline-Element. Daher wäre es vllt. sinnvoll das ganze in ein span zu packen und das zu formatieren
   

   <h2><span>Überschrift</span></h2>

   
   
   Beitrag zuletzt geändert: 9.7.2009 23:09:49 von werktags

4. t*****b

   23:00, 9.7.2009

   Arbeite mit dem Außenabstand: margin-left:20px;
5. Autor dieses Themas

   snoo3

   

   snoo3 hat kostenlosen Webspace.

   23:12, 9.7.2009

   Danke für eure Antworten.
   Aber wenn ich border-bottom nehme wird die Linie ganz durchgezogen. Ich habe danach probiert es als inline-element darzustellen, dadurch hat das einrücken aber nicht mehr funktioniert.
   Mit margin ist es zwar eingerückt, die Linie ist aber auch nur unter dem Text.
   
   @Werktags
   
   Sorry hab dein Edit zu spät gesehen. Funktioniert so perfekt!
   
   Danke und schönen Abend noch
   
   Beitrag zuletzt geändert: 9.7.2009 23:17:27 von snoo3

6. t*****b

   23:24, 9.7.2009

   <h1 style="text-decoration:none;padding-bottom:20px;border-bottom:1px solid black;">Headline1</h1>

7. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?