Schenkeli Thomas: Vertikaler Scrollbalken im IE erscheint immer

Beitrag lesen

Hallo,

ich habe beim Erstellen eines Seitengrundgerüstes mit DIVs ein Problem: egal was ich tue, am rechten Bildschirmrand wird immer eine Scrollbar angezeigt. Falls der Inhalt nicht zu lang ist zwar deaktiviert, aber sie wird angezeigt. Da ich nun nur einen DIV-Bereich haben möchte der Scrollbar ist, stört mich der zusätzliche Scrollbalken ein wenig, da mehr Inhalt zwei nebeneinander angezeigt werden: ein aktiver und ein inaktiver.

Hier mein Code:

<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>

<head>   <meta http-equiv="content-type" content="text/html;charset=utf-8" />   <meta name="generator" content="Adromir" />   <title>Spalten</title>   <style type="text/css" media="screen"><!--

  • { margin: 0; padding: 0; } html, body { height: 100%; display: block; } #top { background-color: #ff8400; position: relative; height: 10%; width: 100%; display: block; } #left { background-color: #051cb5; position: relative; height: 80%; width: 20%; float: left; display: block; } #middle { background-color: #17ab01; position: relative; height: 80%; width: 20%; float: left; display: block; } #right { background-color: #d30000; position: relative; height: 80%; width: 60%; overflow:auto; float: left; display: Block; } #bottom { background-color: #00d1c0; position: relative; height: 10%; width: 100%; clear: left; display: block; } /Dieser Hack ist für Opera/ @media all and (min-width: 0px){ #bottom { margin-top: 0;} #left{margin-bottom: 0;} #right{margin-bottom: 0;} #middle{margin-bottom: 0; margin-right: 0%; margin-left: 0%} } --></style>

<!-- Dies ist der Hack für den IE -->  <!--[if IE]>   <style type="text/css" media="screen">  body {width: 99.5%; margin-bottom: 0.1%;} #left {margin-bottom: 0%; } #middle {margin-bottom: 0%;} #right { margin-bottom: 0%; margin-right: 0%} #bottom { height: 9.99%; } </style>    <![endif]-->

</head>

<body>   <div id="top">Dies ist der Header</div>   <div id="left">Dies ist die Linke Spalte</div>   <div id="middle">Dies ist die Mittlere Spalte</div>   <div id="right">    1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />    11<br />12<br />13<br />14<br />15<br />16<br />17<br />18<br />19<br />20<br />    21<br />22<br />23<br />24<br />25<br />26<br />27<br />28<br />29<br />30<br />    31<br />32<br />33<br />34<br />35<br />36<br />37<br />38<br />39<br />40<br />    41<br />42<br />43<br />44<br />45<br />46<br />47<br />48<br />49<br />50<br />    51<br />52<br />53<br />54<br />55<br />56<br />57<br />58<br />59<br />60<br />   </div>   <div id="bottom">Dies ist die untere Spalte</div>  </body>

</html>

Im Firefox funktioniert es so wie es soll: der DIV-Bereich "right" mit der Eigenschaft "overflow:auto;" ist der einzige der sich scrollen lässt. Nur der IE spielt verrückt.

Wenn ich mir nun andere Seiten wie zB www.google.com ansehe dann ist es da genauso: im IE erscheint immer ein (deaktivierter) Scrollbalken, im Firefox sieht alles gut aus. Auf Seiten die aber mit "bösen" Frames gemacht sind wie zB "http://www.validome.org/doc/HTML_ge/html/frames/anzeige/frames.htm" funktioniert es so wie es soll: Scrollbalken erscheinen nur wenn sie es sollen.

Handelt es sich also um ein allgemeines IE-Problem das nur bei Frames nicht besteht oder gibt es auch für Seiten die auf DIVs basieren einen "Hack"?

Danke für eure Hilfe lg Thomas