[shaun236]

Hi All,

Jeg er helt nyt for web design og I'm lære tingene fra bunden med nogle online tutorials / screencasts. Jeg har brug for lidt hjælp fra jer.

Jeg har fire div i mit markeringssprog. Den ene er en "wrapper" div mens tre andre divs er at vise nogle billeder og indhold. Jeg har centreret om "indpakning" div. Alle tre div inden den har lige bredde og har også lige venstre og højre margen. Siden ser ud smuk mange den måde, jeg vil have det til at se, men når jeg begynder at zoome ind efter et bestemt punkt billederne begynder at overlappe hinanden.

Også når jeg øge / reducere max-bredde for "wrapper" div andre divs inden det ikke er tilpasset ens. Jeg har brugt% for bredde og margin, og jeg troede, der skulle tage sig af det. Hvad skal jeg gør forkert ... du rådgivning?

Jeg har brug for hjælp med følgende:

1.Når I zoom-in hvorfor billeder starte overlappende?
2. Når jeg nulstille "wrapper" max-bredde hvorfor ikke andre divs bevare sin position?

Please råd, hvordan jeg kan løse dem? Jeg har også vedlagt min markeringssprog fil.

Thanks in advance!

HTML Code:


Elastic Layout





Dette er div1







Dette er div2







Dette er div3









CSS Regler

Code:


body (
margin: 0;
padding: 0;
)

# wrapper (
margin: 0 auto;
max-width: 60em;
border: 1px stiplede blå;
height: 20em;
)

# div1 **
float: left;
Bredde: 30,1%;
margin: 0 1,6% 0 1,6%;
)

# div2 **
float: right;
Bredde: 30,1%;
margin: 0 1,6% 0 1,6%;
)

# div3 **
float: left;
Bredde: 30,1%;
margin: 0 1,6% 0 1,6%;
)



Vedhæftede filer ElasticLayout.zip (4,7 KB)