hallo,
ich habe ein anfängerproblem... und zwar bekomme ich meine divs nicht horizontal zentriert, dh. ich habe ein prob mit dem overflow.
fakt:
2 divs, eins rechts, eins in der mitte. horizontal zentriert mit 50% und -300margin.
bei hoher auflösung: alles klar.
wenn ich aber meinen browser horizontal kleiner schiebe, bzw mit netbookauflösung anschaue,
kommt wie gewolllt die scrollleiste, aber das linke div bekommt abstand von unten und das mittlere verschwindet nach unten..
ich hätte aber gerne, dass beide in vollem format horizontal zentriert bleiben und scrollbalken bekommen.
das ist das linke div:
#naviscroll {
position:absolute;
width:325px;
height:100%;
z-index:10;
left: 0px;
overflow: auto;
padding: 0px;
top: 50%;
margin-top: -300px;
}
#weissakk{
background-image: url(bilder/menuKeybordBack2.png);
background-repeat: no-repeat;
height: 600px;
width: 300px;
}
#keyboard {
position: absolute;
left: 5px;
top: 184px;
}
<div id="naviscroll">
<div id="weissakk"><a href="index.html"><img src="bilder/blank388x180.png" width="300" height="180" alt="home" /></a>
<div id="keyboard">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="275" height="396" id="keyboardSmart" align="middle">
...
..
inhalt..
..
</div> </div></div>
Alles anzeigen
und dieses das mittlere:
#textbox {
position:absolute;
width:650px;
height:550px;
left: 30%;
overflow: auto;
top: 50%;
margin-top: -300px;
padding: 25px;
text-shadow:0px -1px 3px black;
/* Versatz links - Versatz oben - Unschärfe (Blur) - Farbe */
}
#refPic {
margin: 5px;
text-align: center;
}
#refTxt {
text-align: justify;
margin: 5px;
}
#refTxt-foot {
font-size: 12px;
font-style: italic;
text-align: right;
margin: 5px;
}
<div id="textbox">
<div id="refPic"><img src="bilder/querblauerhimmel.jpg" alt="loschi" width="600" height="216" /></div>
<div id="refTxt"><em>„Seemann Loschi“ und sein Schifferklavier gehören zusammen wie der Wind und das Meer.</em> <em>„ Loschis“ Großvater war Musiker, der Vater Seemann.</em> <em>Wen wundert es, dass die „Mischung“ für wahr gelungen ist. ...</em></div>
<div id="refTxt-foot"><em>(Landesheimatverband Mecklenburg-Vorpommern e.V.)</em></div>
<div class="style21" id="refPic"><img src="bilder/querSunthorice09-Toern02.jpg" width="600" height="231" alt="LOSCHI auf dem Schiff" /></div>
<div id="refTxt"><em>Ein wenig zotig mit netter Anmache und guter Stimme.</em> <em>Als Darsteller überzeugend, animiert er das Publikum. ...</em></div>
<div id="refTxt-foot"><em>(Das Kultur- und Veranstaltungsmagazin „Rügen, Stralsund aktuell“)</em></div>
<div id="refPic"><img src="bilder/querhafen.jpg" width="600" height="226" alt="LOCHI im Hafen" /></div>
<div id="refTxt"><em>Bereits seit 1998 begleitet „Seemann Loschi“ anlässlich der Hanse-Sail Rostock die Segeltour des</em> <em>Mecklenburger Blitz-Verlages mit Geschäftskunden musikalisch. Durch sein vielfältiges Programm und seine freundliche Art sorgt er immer für die richtige Stimmung an Bord – und das den ganzen Tag lang! „Seemann Loschi“ singt nicht nur ein umfangreiches Repertoire an Seemannsliedern, die er selbst mit seinem Akkordeonspiel untermalt, sondern bezieht die Gäste mit Witz, Spaß und Seemannsgarn auf sehr angenehme Weise in sein Programm ein. Ein Tag an Bord wird dadurch recht kurzweilig. </em></div>
<div id="refTxt-foot"><em>(Blitz Verlag und Werbeagentur GmbH, Vorpommern Blitz)</em></div>
<div id="refPic"><img src="bilder/quermohle.jpg" width="600" height="135" alt="LOSCHI an der Mohle" /></div>
<div id="refTxt"><em>„Seemann Loschi“ haben wir als einen sehr ehrenhaften und zuverlässigen Geschäftsmann kennen gelernt, der stets alle vertraglichen Verpflichtungen erfüllt. Wir freuen uns, dass „Seemann Loschi“ die geschäftlichen Verbindungen weiter ausbaut und werden auch in Zukunft die geschäftlichen Beziehungen zu ihm aufrechterhalten. ...</em></div>
<div id="refTxt-foot"><em>(MV Best, Reise- und Eventveranstalter)</em></div>
<div id="refPic"><img src="bilder/quermeer.jpg" width="600" height="215" alt="LOSCHI an der Mohle" /></div>
<div id="refPic">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="650" height="40" id="FlashID2" title="Referenzen">
<param name="movie" value="bilder/ticker.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="7.0.70.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="bilder/ticker.swf" width="650" height="40">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="7.0.70.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</div>
Alles anzeigen
sorry, die situation ist schwer zu beschreiben.. ich hoffe, jemand von euch hat genug imaginationskraft..
sven
die seite ist temporär zu sehen auf: http://test.thepetsitters.net