Avatar billede mmcduck Nybegynder
29. september 2006 - 18:09 Der er 5 kommentarer og
1 løsning

centrering af billede i div

Her er en lille udfordring:

jeg har et billede som jeg ikke umiddelbart (i koden) ved om er et billede på højkant eller ej (horisontal eller vertikal).

Det eneste jeg ved er, at enten er højden lig med 142px eller også er bredden lig 188px.

hvordan får jeg dette centreret midt i en div der er 188x142, hvis det ellers kan lade sig gøre?

jeg er kun interesseret i noget der virker i alle browsere, ikke noget der kun virker i f.eks. IE eller FF, det skal være dem begge som minimum.
Avatar billede tjaz Nybegynder
29. september 2006 - 22:16 #1
En måde du kan gøre det på er, at anvende CSS og så indsætte dit billede som en baggrund i din div. på den måde vil du kunne styre det med background-position (er testet i IE og FF hvor det virker, men kan umiddelbart ikke se hvorfor det ikke skulle virke i andre da det er CSS):

<style type="text/css">
.picture {
    background-position:center center;
    background-repeat:no-repeat;
    border:1px solid #000000;
    height:142px;
    width:188px;
   
}
</style>

<div style="background-image:url(edit.jpg);" class="picture"></div>
Avatar billede tjaz Nybegynder
29. september 2006 - 22:16 #2
edit.jpg skifter du self ud med dit eget billede, det var bare lige det mindste billede jeg havde liggende at teste med :P
Avatar billede tjaz Nybegynder
03. oktober 2006 - 13:24 #3
respons?
Avatar billede mmcduck Nybegynder
03. oktober 2006 - 17:22 #4
Jeg sigter stadig efter en løsning hvor det ikke er nødvendigt at indsætte billederne som baggrunde.

Hvis der ikke er andre der kan komme med en bedre løsning end den som vi begge er kommet frem til, skal du nok få point ;-)
Avatar billede mmcduck Nybegynder
06. oktober 2006 - 16:40 #5
well
Der er åbentbart ingen der har en anden løsning end baggrundsbilleder.
Avatar billede tjaz Nybegynder
20. oktober 2006 - 16:28 #6
næ, lader ikke til det
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester