WN - Hur löser jag detta CSS-problem??

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Hur löser jag detta CSS-problem?? (https://www.wn.se/forum/showthread.php?t=1045099)

DonnyBystrom

2010-11-29 08:47

Hur löser jag detta CSS-problem??

Kunden vill ha en linje efter H2-taggen som automatiskt fyller utrymmet kvar i containern. Hur fasiken löser man det på ett kompatibelt, smidigt sätt?

http://img151.imageshack.us/img151/4712/problem.gif

DonnyBystrom

2010-11-29 10:44

Hittade inget annat än en fullösning som inte är särskilt WYSIWYG-vänlig...

<div><h2>Rubrik</h2><hr/></div>

Monkboll

2010-11-29 11:15

ge h2 taggen fast bredd? block och en border-bottom?

oskarh

2010-11-29 11:21

sätt en bakgrund på h2-taggen, samma som övriga sidans så att h2-taggens bakgrund är "osynlig" och sedan får du positionera den över ett streck, kanske i form av en bild?

KarlRoos

2010-11-29 11:22

Kod:

<h2><span>En rubrik</span></h2>

Kod:

h2

{border-bottom: 1px solid #000;}

        

h2 span

{background: #fff; margin-bottom: -1px; padding-right: 5px;}

;)

DonnyBystrom

2010-11-29 12:38

Tack så mycket för alla svar! Men det verkar inte som att span-bakgrunden lyckas dölja bordern, iaf inte i Chrome & Safari. :(

Citat:

Ursprungligen postat av KarlRoos (Inlägg 20380293)

Kod:

<h2><span>En rubrik</span></h2>

Kod:

h2

{border-bottom: 1px solid #000;}

        

h2 span

{background: #fff; margin-bottom: -1px; padding-right: 5px;}

;)

DonnyBystrom

2010-11-29 16:12

Fick det att funka genom att lägga till display:inner-block; i h2 span. Borde till och med stödjas i IE7. Tack igen :)

Alla tider är GMT +2. Klockan är nu 14:54.