nicht angemeldet
Hallo,
Die Seite soll mit CSS aufgebaut werden. Egal wie gross der Browser ist soll rechts immer ein weisser Balken von 150px zu sehen sein. Soweit nicht kompliziert - aber jetzt kommts: Die Seite wird horizontal scrollbar sein - hat also effektiv eine Breite von 5x Browserbreite.
Hat irgendwer eine Idee wie man das lösen könnte?
Folgendes sah in den aktuellen Versionen von Firefox, Opera, Chrome und IE so aus, wie ich Deine Beschreibung verstanden habe:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>[code lang=css]
html {
margin: 0;
padding: 0;
background-color: white; /* weißer Balken */
overflow: scroll; /* stets im Blick */
}
body {
margin: 0;
padding: 0;
position: absolute; /* damit bekommen wir */
top: 0;
right: 150px; /* 150 Pixel rechts */
bottom: 0;
left: 0;
overflow-y: hidden; /* ohne vertikalen Scrollbalken */
}
#container {
width: 500% /* Fünffache Breite */
}
div {
width: 20%; /* und jeder einzelne */
margin: 0; /* wieder 100% Breite */
padding: 0;
display: inline-block; /* hübsch nebeneinander */
vertical-align: middle; /* nur für die Demo */
font-size: 5em; /* nur für die Demo */
text-align: center; /* nur für die Demo */
}
#c1 {
background-color: #033; /* Farben für die Demo */
}
#c2 {
background-color: #066;
}
#c3 {
background-color: #099;
}
#c4 {
background-color: #0BB;
}
#c5 {
background-color: #0FF;
}
</style>
</head>
<body>
<div id="container">
<!-- Kein Whitespace! Oder unterdrücke es mit CSS ... -->
<div id="c1">1</div><div id="c2">2</div><div id="c3">3</div><div id="c4">4</div><div id="c5">5</div>
</div>
</body>
</html>[/code]
Mit weniger Markup bin ich nicht ausgekommen. Vielleicht weiß ja Gunnar, wie man auf das "Container"-Div verzichten kann ...
Freundliche Grüße
Vinzenz
Matthias Apsel