webForumDet fria alternativet
Logga in / Bli medlem

hr med gif

HTML & CSS

9 svar · 239 visningar · startad av silfver

Medlem sedan apr. 200312 679 inlägg
Trådstart#1

Hur ska man göra?

vill ha det i en class, så det får gärna se ut såhär:

<hr class="streck">

mvh

Medlem sedan nov. 200013 890 inlägg
#2

Du får gärna beskriva det hela lite mer i detalj.
Kanske är det något sådant här du menar?

HR.streck {
 background-image: url('bild.gif');
}
Medlem sedan apr. 200312 679 inlägg
#3

Ja, jag menar så som du skrev. En radbrytning med en bild.

Skrev såhär:

HR.streck {
background-image: url(hr.jpg');
}

men det funkade inte. Måste det var gif?

mvh

Medlem sedan nov. 200013 890 inlägg
#4

Det måste inte vara gif men du har missat en fnutt. ;)

Medlem sedan apr. 200312 679 inlägg
#5

Oj, men det var bara fel här på sidan:

HR.streck {
background-image: url('hr.jpg');
}

<hr class="streck">

allting är väl i sin ordning? Funkar ändå inte.

mvh

Medlem sedan juli 20013 378 inlägg
#6

Har du satt höjd på strecket?
I en <hr> får du med en "gråaktig" 3D-effekt som gör att strecket inte visas om höjden är "för liten"...

Om inte <hr> funkar för dig pga detta kan du också använda en "tom div" om du är noga med att sätta höjd på både div-taggen och dess font-size ;) ...

Se exempel på bägge varianterna här: http://member.webforum.nu/2241/streck.html

Medlem sedan apr. 200312 679 inlägg
#7

okej! tack. Hur hög måste bilden vara då för att den ska kunna visa den som en "<hr>" ?

Och hur gör jag en div med den bakgrunden jag vill ha?

mvh

Medlem sedan apr. 200312 679 inlägg
#8

<div background="#000000"> </div> funkar inte? =)

mvh

Medlem sedan juli 20013 378 inlägg
#9

Hur hög måste bilden vara då för att den ska kunna visa den som en "<hr>" ?

Hmm...
Empirisk forskning i Moz 1.3 och MSIE6 ger att du får 1px höga gråa streck upptill och nedtill, och att 2px verkar vara för lite... Provar man med 3px får du ett mycket smalt "bildstreck" med "gråa kanter"...

Och hur gör jag en div med den bakgrunden jag vill ha?

*harkel*
Här är "vitala delar" av filen jag laddade upp ;)

<style type="text/css">
<!--
.streck {
	background-image: url('testbild.gif'); 
	height:5px;
}
.strecket {
	background-image: url('testbild.gif');
	height: 5px;
	font-size:5px;
}
-->
</style>
...

<hr class="streck" />
...
<div class="strecket">&amp;nbsp;</div>

<div background="#000000"> </div> funkar inte? =)

Hmm
Osäker på hur du menar, men

<div style="background-color:#000000;height:5px;font-size:5px">&amp;nbsp;</div>

Funkar...
Liksom t.ex.

<div style="background-image: url('testbild.gif');height:5px;font-size:5px">&amp;nbsp;</div>
Medlem sedan apr. 200312 679 inlägg
#10

jarvklo skrev:

<style type="text/css">
<!--
.strecket {
background-image: url('testbild.gif');
height: 5px;
font-size:5px;
}
-->
</style>

<div class="strecket"> </div>

använder jag nu! Funkar perfekt, tack ska du ha!

265 ms totalt · 4 externa anrop · v20260731065814-full.51f67c91
129 ms — deklarationer (db)
0 ms — hämta statistik (cache)
133 ms — hämta tråd, inlägg och bilagor (db)
123 ms — ändringar (db)