[shaun236]

Hi All,

Ich bin völlig neuen Web-Gestaltung und ich lerne die Dinge von Grund auf neu mit einigen Online-Tutorials / Screencasts. Ich brauche etwas Hilfe von euch.

Ich habe vier div in meinem Markup. Eine davon ist die "Wrapper" div während drei anderen divs sind, um einige Bilder und Inhalte. Ich habe zentriert die "Wrapper" div. Alle drei div innerhalb hat gleiche Breite und hat auch gleich linken und rechten Rand. Die Seite sieht ziemlich viel, wie ich es wollte zu suchen, aber wenn ich um das Bild zu vergrößern, nachdem in einem bestimmten Punkt beginnen die Bilder zu überschneiden.

Auch wenn ich Erhöhung / Verringerung der max-width für "Wrapper" div anderen divs innerhalb es nicht gleich an. Ich habe% in der Breite und Marge und ich glaubte, daß sollte sich darum kümmern wird. Was mache ich falsch ... bitte Beratung?

Ich brauche Hilfe bei der folgenden:

1.Wenn ich zoom-in, warum die Bilder beginnen Überschneidungen?
2.Wenn ich den "Wrapper" max-width, warum nicht andere divs ihre Position?

Bitte Ratschläge, wie ich sie beheben können? Ich habe auch meine Markup-Datei beigefügt.

Vielen Dank im Voraus!

HTML-Code:


Elastic Layout





Dies ist div1







Dies ist div2







Dies ist DIV3









CSS-Regeln

Code:


body (
margin: 0;
padding: 0;
)

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

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

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

# DIV3 **
float: left;
Breite: 30,1%;
margin: 0 1,6% 0 1,6%;
)



Angehängte Dateien ElasticLayout.zip (4,7 KB)