Hey allemaal,

Krijg het maar niet voor elkaar.
Ik wil een image in een div uitlijnen.

De div is bijv. 200px width bij 100px height.
Daarin staat een plaatje van 500px bij 200px.

De div staat op overflow:hidden.
Nu wil ik graag dat plaatje in het midden van de div uitlijnen.
Maar ik krijg dit bijna niet voor mekaar, wie weet hoe?

Groeten,
Tim
een text-align center op die div zetten?
Maar waarom is die afbeelding zo gigantisch? probeer dat zoveel mogelijk te voorkomen. Het is altijd beter als je het schalen door je browser voorkomt.
Hey, Tim,

Probeer het eens met de CSS van de IMG de padding-left: -250px; padding-top:-100px;

Grts... René
Maak er een background van en klaar is kees. Backgrounds kun je positioneren.

@ Rene: Negative waardes kun je alleen op margin doen, niet op padding.
Ik had nu dit overigens.

<code>
.junior-post-image {
height:170px;
overflow:hidden;
margin-top:5px;
}

.junior-post-image img {
border:none;
position:relative;
left:-125px;
top:-72px;
}
</code>

Werkt wel in IE 8 maar in IE 7 zie ik dan gewoon het hele plaatje.
Iemand nog een idee?
@Mitchell helaas kan dat niet, de image veranderd dan weer bij elk blog bericht. ;-) het staat zo in de while.

Gelieve Niet Bumpen:

Twee of meer keer achter elkaar in een topic posten heet bumpen. Bumpen is pas na 24 uur toegestaan en kan een reden zijn voor de admins en moderators om een topic te sluiten. Gebruik indien nodig de knop om je tekst aan te passen.

SanThe.
Nee, gewoon het plaatje als background van je div instellen.
style="background-image: url()" kun je altijd nog gebruiken als het constant een ander plaatje is.

Min margins en positioning zijn beide slechte keuzes in dit geval.
Dus bijv. zo:

div#foto					{height: 200px; width: 200px; background: gold url(gfx/mozart.jpg) 50% 50% no-repeat;}
<?php
div#foto {height: 200px; width: 200px; background: gold url(gfx/mozart.jpg) 50% 50% no-repeat;}
?>

Maar hoe kan ik dit dan wijzigen vanuit mijn php while?
Daar kan ik toch niet meer mijn (al geladen) stylesheet aanpassen?!

Zoals ik al zei, gebruik style="" om die dan te veranderen.


<div style="background-image: url();"></div>

Reageren