[shaun236]

Hi All,

Ik ben volledig nieuwe website te ontwerpen en ik ben het leren van dingen van de grond af met enkele tutorials / screencasts. Ik heb wat hulp van jullie.

Ik heb vier div in mijn markup. Een daarvan is een "wrapper" div terwijl de andere drie divs zijn om sommige beeld en inhoud. Ik heb het midden van de "wrapper" div. Alle drie de div binnen het gelijke breedte en heeft ook gelijk de linker en rechter marge. De pagina ziet er nogal veel van de manier waarop ik wil het er te laten uitzien, maar als ik begin om in te zoomen na een bepaald punt de beelden beginnen te overlappen.

Ook toen ik verhogen / verlagen van de maximale breedte voor "wrapper" div de andere divs binnen zijn niet afgestemd even. Ik heb gebruikt% voor de breedte en de marge en ik dacht dat moet zorgen. Wat doe ik fout ... kunt u advies?

Ik heb hulp nodig met de volgende tekst:

1.Wanneer ik inzoomen waarom beelden beginnen overlappende?
2.Wanneer ik de "wrapper" max-width waarom geen andere divs haar positie?

Gelieve advies hoe ik kan herstellen? Ik heb ook mijn markup bijgevoegde bestand.

Thanks in advance!

HTML-code:


Elastische Layout





Dit is div1







Dit is div2







Dit is div3









CSS Regels

Code:


body (
margin: 0;
padding: 0;
)

# wrapper (
margin: 0 auto;
max-width: 60em;
border: 1px dotted blauw;
height: 20em;
)

# div1 **
float: links;
breedte: 30,1%;
margin: 0 1,6% 0 1,6%;
)

# div2 **
float: rechts;
breedte: 30,1%;
margin: 0 1,6% 0 1,6%;
)

# div3 **
float: links;
breedte: 30,1%;
margin: 0 1,6% 0 1,6%;
)



Bijgevoegde bestanden ElasticLayout.zip (4,7 KB)