PDA

Volledige versie bekijken : positioneren van een img binnen een div


Lippuzz
%Europe/Berlin %980 %2008, 00:31
Ik hebben binnen mijn sites enkele blokken.
deze blokken vormen de content voor de home.

een blok is 1 div met daarin:

een head; h3
een onderschrift; h4
en tekst; p

dit alles heeft een padding van 100px In de lege ruimte wil ik een paatje zetten.
Dit heb ik gedaan dmv een div in het blok div te zetten. Dit lukt, alleen klopt de verticale positionering niet. Ook verschilt dit in IE en FF (de mate van verschil)

de html
<div class="block">
<div class="image" ><img width="90" src="images/arche.jpg" /></div>
<h3> Main Content </h3>
<h4>onderschrift</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. </p>

</div>

de css
.block {
background:url(images/tile_block.jpg);
background-repeat:repeat-x;
background-position:top;
margin-top: 0px;
margin-left: 160px;
margin-right: 195px;
padding: 0 10px;
}

.image{
width: 90px;
border: 1px solid #000000;
float:left;
padding-top:0px;
margin-top:-50px;

}
.block h3{
font-weight: bold;
margin:0px;
font-size: 12px;
color:#464749;
padding: 0px 0px 0px 100px;
font-family:Arial, Helvetica, sans-serif;
}
.block h4{
font-family:Arial, Helvetica, sans-serif;
font-weight: normal;
margin:0px;
font-size: 12px;
color: #464749;
padding: 0px 0px 0px 100px;
}


.block p{
padding: 0px 0px 0px 100px;
margin-top: 10px;
}

Icemar
%Europe/Berlin %206 %2008, 05:56
Als je met position wil werken dan moet je 1 div hebben wdie relative is dus in dit geval je block.
En de div die je een vaste positie moet hebben die geef je absolute mee.
en dan kan je de postion bepalen.

Lippuzz
%Europe/Berlin %557 %2008, 14:22
Dank u, werkt nu perfect!