nicht angemeldet
Hallo,
ich habe ein Problem mit der Darstellung von 7 DIV Elemente Nebeneinander.
Der IE macht dies wunderbar --> er macht keinen Umbruch, sondern bringt das Fentser zum scrolen.
Aber der FF macht diesen wiederlichen Umbruch.
Wie macht der FF auch diese Scrollbar, damit die DIV's nicht abgebrochen werden?
Ich habe schon manches gelesen und ausprobiert, aber keine lösung gefunden.
Ich wäre über jede Idee dankbar.
Gruß
Tobias
Anbei der Code:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.rgs.css" rel="stylesheet" type="text/css" />
</head>
<body leftmargin="0" rightmargin="0" topmargin="0" marginwidth="0" marginheight="0" id="page" class="page">
<!-- ###DOCUMENT### beginn -->
<div class="page-header"><a href="/" id="header-link2"><img width="1000" height="30" alt="Richtsberg-Gesamtschule Marburg" src="###HEADER_SRC###" border="0"/></a><div>
<div class="menu-top-box">
<span class="menu-top" id="logo">###LOGO###</span>
<span class="menu-top" id="tmF">###MENU_F_TITEL###<div id="menuF">###MENU_F###</div></span>
<span class="menu-top" id="tmE">###MENU_E_TITEL###<div id="menuE">###MENU_E###</div></span>
<span class="menu-top" id="tmD">###MENU_D_TITEL###<div id="menuD">###MENU_D###</div></span>
<span class="menu-top" id="tmC">###MENU_C_TITEL###<div id="menuC">###MENU_C###</div></span>
<span class="menu-top" id="tmB">###MENU_B_TITEL###<div id="menuB">###MENU_B###</div></span>
<span class="menu-top" id="tmA">###MENU_A_TITEL###<div id="menuA">###MENU_A###</div></span>
</div>
</div>
</div>
<div class="page-box">
<div class="menu-standard">
<form action="de/weiteres/suchen.html" method="post" name="tx_indexedsearch">
###HOME###
###CONTACT###
###PRINT###
###PDF###
###MAP###
<input type="text" name="tx_indexedsearch[sword]" value="suchen..." onfocus="this.value='';" class="search-text" />
<input type="image" src="fileadmin/DESIGN/PICTURE/symbol.search.gif" name="tx_indexedsearch[submit_button]" value="Suche" class="" />
<input type="hidden" name="tx_indexedsearch[_sections]" value="0" />
<input type="hidden" name="tx_indexedsearch[pointer]" value="0" /><input type="hidden" name="tx_indexedsearch[ext]" value="0" />
###INFO###
###HELP###
###EDIT###
</form>
</div>
<div class="sidebar">
<div class="menu-sub" style="background-color:###SUB_MENU_BGCOLOR###">###MENU_SUB###</div>
###CONTENT_LEFT###</div>
<div class="content-box">###BREADCRUMB###<br />
<!-- ###TYPO3SEARCH### beginn -->###CONTENT_CENTER###<!-- ###TYPO3SEARCH### end -->
<div class="footer"><span id="footer-top">###TOP### | ###LASTUPDATE###</span><br />
© xxx| <a href="http://www.xxx.de/de/weiteres/impressum.html" target="_top">Impressum</a> | <a href="mailto:xxx@richtsbergschule.de" title="Jan-Lennart Büttner | Emilio Buchelt">Webmaster</a> | Design by <a href="mailto:xxx@i-see.de">Tobias Müller</a><br />xxx| <a href="mailto:info@richtsbergschule.de">xxx@richtsbergschule.de</a></div></div>
</div>
<!-- ###DOCUMENT### end -->
</body>
</html>
CSS:
/* PAGE */
.page {
width:100%;
}
.page-box {
margin-top:1px;
margin-left: 0px;
}
.sidebar {
width: 200px;
left: 2px;
float: left;
position: relative;
z-index: 100;
margin-right: 4px;
}
/* CONTENT */
.content-box {
float:left;
margin-left: 6px;
width: auto;
bottom: 0px;
margin-bottom: 50px;
}
#padding {
padding-left:4px;
}
/* Suchenfeld */
.search-text {
border: #e5352d 2px solid;
padding: 2px;
background: #FFFFFF;
width: 100px;
color:#e5352d;
height: 20px;
}
.search-field {
float: right;
}
/* MENU */
.menu-top-box {
overflow:visible;
page-break-after: avoid;
visibility: visible;
}
.menu-standard {
font-size:12px;
text-align: right;
float: right;
margin-right: 3px;
width: 100%;
page-break-after: right;
}
.menu-breadcrumb a, .menu-breadcrumb {
font-size:10px;
color:#777777;
}
#tmA {
background-color:#cc3333;
white-space: nowrap;
page-break-after: avoid;
}
#tmB {
background-color:#3399cc;
white-space: nowrap;
page-break-after: avoid;
}
#tmC {
background-color:#99cc00;
white-space: nowrap;
page-break-after: avoid;
}
#tmD {
background-color:#ffcc33;
white-space: nowrap;
page-break-after: avoid;
}
#tmE {
background-color:#ffffff;
white-space: nowrap;
page-break-after: avoid;
}
#tmF {
background-color:#cc3333;
white-space: nowrap;
page-break-after: avoid;
padding: 0px;
margin: 4px 0 0 0;
height: 166px;
}
#menuA {
color:#993300;
page-break-after: avoid;
}
#menuB {
color:#993300;
page-break-after: avoid;
}
#menuC {
color:#993300;
page-break-after: avoid;
}
#menuD {
color:#993300;
page-break-after: avoid;
}
#menuE {
color:#993300;
page-break-after: avoid;
}
#menuF {
color:#993300;
page-break-after: avoid;
}
#logo {
width:auto;
border: 1px dotted #fbc233;
margin-left: 3px;
}
#standard {
color:#000000;
}
.menu-sub {
padding:2px;
}
/* BODY */
BODY {
font-family:Calibri, Arial, Verdana, sans-serif;
font-size:12pt;
margin:0;
padding:0 0 100px 0;
}
/* FOOTER */
.footer {
font:calibri, arial;
font-size:10px;
color:#666666;
/*text-align:left;
position:absolute;*/
padding:4px;
background:#FFFFFF;
margin-top: 20px;
}
/*
#footer{
position:absolute;
bottom:0;
left:0;
width:100%;
height:50px;
}
@media screen{
body>div#footer{
position:fixed;
}
}
* html body{
overflow:hidden;
}
* html div#footer{
height:100%;
overflow:auto;
}
*/
#footer-top {
font-size:10pt;
color:#000000;
}
MudGuard