afbeelding op ene pagina wel uitgelijnd en de andere niet
Ik ben bezig om een website te maken waarbij je drie afbeeldingen naast elkaar hebt. Door middel van justify wil ik de drie afbeeldingen uitlijnen over een div. Ik heb hiervoor een class gemaakt, maar op de ene pagina doet hij dit wel en op andere pagina lijnt hij niet uit.
Mijn vraag is: kan iemand mij adviseren hoe ik dit kan oplossen dat de drie afbeeldingen op alle pagina's hetzelfde uitgelijnd worden?
Mijn css is:
.right{
margin: 30px;
text-align: justify;
}
div#box4{
width: 1000px;
background-color: #660000;
float: left;
}
pagina 1 hier wordt wel uitgelijnd:
<div id="box4">
<h2>Gebouwen</h2>
<p class="right">
<img src="images/gebouwen/image1.jpg" width="250" alt="text">
<img src="images/gebouwen/image.jpg" width="250" alt="text">
<img src="images/gebouwen/image3.jpg" width="250" alt="text">
<img src="images/gebouwen/image3.jpg" width="250" alt="text">
</p>
</div>
pagina 2 hier wordt niet uitgelijnd:
<div id="box4">
<h2>Musea</h2>
<p class="right">
<img src="images/musea/image4.JPG" width="250" alt="text">
<img src="images/musea/image5.jpg" width="250" alt="text">
<img src="images/musea/imagr6.jpg" width="250" alt="text">
</p>
</div>
alvast bedankt.
Je kan dit beter doen met margin: 0 auto; dan met justify
Alleen zal je een wrapper moeten maken om de div denk ik. Anders kan je wellicht het plaatje zelf deze eigenschap geven.
Code (php)
1
2
3
2
3
.box img {
margin: 0 auto;
}
margin: 0 auto;
}
En anders, upload de gehele zooi ergens naartoe zodat we een pagina kunnen bekijken want hier worden we niet super veel wijzer van
Mocht je toch een dynamische breedte gecentreerd uitgelijnt willen hebben, gebruik ik altijd de 'truc' om een display:table; en margin:0 auto; mee te geven. Door de display:table; kun je een dynamische element centreren.