Tja
Jag har i en <h1> infogat en bild och jag vill att texten ska vara i mitten av bilden, går det att göra på nått sätt att texten åker upp ett par px?
Så här är koden <h1><img src="bild.gif" /> rubrik</h1>
CSS-fråga, bild jämsides med text.
6 svar · 623 visningar · startad av MagnusJ
Detta är nog det närmaste du kommer: :)
<h1><img src="bild.gif" style="vertical-align:middle;"/> rubrik</h1>
Tacktack, men blev inte riktigt nöjd, kom lite för högt upp. Men din kod-snutt fick mig att tänka på att man kunde lägga in en bakgrundsbild i h1 med hjälp av style=" " och på så sätt kan man ha olika bilder för olika h1, sedan så ändrar man höjden osv med padding, tacktack. :)
Va bra att du löst det! :)
Själv hade jag nog bollat med margin i kombination med vertical-align på bilden istället för att lägga den som bakgrund.
typ så här:
<h1><img src="bild.gif" style="vertical-align:middle; margin-top:5px;"/> rubrik</h1>
och så justerar du margin-top tills du blir nöjd! (tänk på att du även kan använda negativa tal i margin, t.ex. -5px).
möjligtvis kanske du får byta vertical-align till top eller text-top.
doggelite> vad är det för fördelar med marginal trixet jämfört med att göra som mgnus3 gjorde? Själv brukar jag göra det i css:en, men jag har förstått att många gör som du.
Det beror lite på vad bilden föreställer.
Är det bara en design-bild, dvs. en linje eller nån utfyllnad så går det bra att lägga som bakgrundsbild men föreställer bilden något så bör man lägga den som en vanlig bild.
Jag är inte jättepåläst om detta men ett av skälen till detta är att bakgrunder inte kan läsas av röstuppläsningsproggs. för de som är synskadade.
Du kan heller inte t.ex. sätta alt-text på en bakgrund.
För egen del så tycker jag bara att det är lättare att placera bild och text snyggt! ;)
überfuzz skrev:
Själv brukar jag göra det i css:en, men jag har förstått att många gör som du.
Det gör jag också!
.rubrikbild
{
vertical-align:top;
margin-top:5px;
}
...
<h1><img src="bild.gif" class="rubrikbild"> rubrik</h1>
joho det går alldeles utmärkt
<body id="start"><h1 title="titulerad istället för alt">rubrik</h1>
body#start h1 { background:url(bild.jpg) top left no-repeat; height:50px; width:98%;
padding:10px 0px 0px 60px; font:25px/30px Georgia; }