# div mit absolute, top, bottom und overflow:auto im IE



## Layna (17. April 2007)

Hallo.
Folgendes problem:

HTML:

```
<div id="spalte_mitte">
		<div id="nav"> 
		<span> 

			<!-- ###MENU### START-->  
			<!-- ###MENU### END--> 		  
		</span>
  		</div>  
		<div id="content">
			<!-- ###CONTENT### START-->  
			<!-- ###CONTENT### END--> 
		</div>
		<div id="unten_mitte"></div>
	</div>
```

CSS dazu:


```
html, body, div {
	padding: 0px;
	margin: 0px;
	border-width: 0px;
	background-color: #575757;
}

html, body, #aussen {
	height: 100%;
}


#spalte_links, #spalte_mitte, #spalte_rechts{
	position: absolute;
	top: 0px;
	bottom: 0px;
	height: 100%;
}

#spalte_mitte{
	left: 222px;
	width: 650px
}

#content {
	position: absolute;
	top: 180px;
	bottom: 100px;
	width: 100%;
	overflow: auto;
	border: 2px solid red;
}
```

#nav und #unten_mitte haben feste höhen.

Im firefox bekomme ich so in der mitte ein content-div das bei Bedarf scrollt.
Im IE leider nicht. Habe schon alles was mir so einfiel ausprobiert (paddings, margins etc..), aber der IE betseht ture darauf die Seite und das div zu vergrössern.
Fällt noch irgednjemandem etwas ein?


----------



## Maik (17. April 2007)

Hi,

da der IE (< Version 7) die Kombination der Positionsangaben top/bottom für ein Element nicht unterstützt, empfehle ich dir die vorgeschlagenen Techniken im CSS-Tutorial Tabellenloses Basislayout mit fixierten und separat scrollbaren Blöcken.

Alternativ kannst du ja auch mal einen Blick auf Stu Nicholls' CSS-Layouts werfen, in denen er ebenfalls eine der beiden Techniken einsetzt:


http://www.cssplay.co.uk/layouts/bodyfix.html
http://www.cssplay.co.uk/layouts/body4.html


----------



## Layna (17. April 2007)

*TYPO3!: div mit absolute, top, bottom und overflow:auto im IE*

Was man nicht alles bedenken muss....
AAAALSO, die betreffende website ist in Typo3 untergebracht... der Ausschnitt von eben stammt aus dem Template. Ich habe nochmal NUR das Template mit der style-datei OHNE Typo3 getestet: DA scrollt der IE.

Der Ausschnitt aus der betroffenen Website NACH Typo3 ist schon etwas monströser:


```
<div id="spalte_mitte">
		<div id="nav"> 
		<span> 

			<a href="index.php?id=67" onfocus="blurLink(this);">Hochzeitsfotos</a><a href="index.php?id=66" onfocus="blurLink(this);">Bewerbungsfotos</a><a href="index.php?id=65" onfocus="blurLink(this);">Traumfotos</a><a href="index.php?id=64" onfocus="blurLink(this);">Mehr schöne Fotos</a><a href="index.php?id=63" onfocus="blurLink(this);">Öffentliche Fotos</a><a href="index.php?id=62" onfocus="blurLink(this);">Gebäudefotos</a><a href="index.php?id=61" onfocus="blurLink(this);">Versteckte Fotos</a> 		  
		</span>
  		</div>  
		<div id="content">
			
	<!--  CONTENT ELEMENT, uid:50/text [begin] -->
		<a id="c50"></a>
		<!--  Header: [begin] -->
			<div class="csc-header csc-header-n1"><h1 class="csc-firstHeader">Ein Testetx<a href="http://localhost/typo3/typo3/alt_doc.php?edit[tt_content][50]=edit&amp;columnsOnly=header%2C%20%5Bheader_layout%20%7C%20header_position%5D%2C%20%5Bheader_link%7Cdate%5D&amp;noView=0&amp;returnUrl=%2Ftypo3%2Findex.php%3Fid%3D66"><img src="typo3/gfx/edit_fe.gif" width="11" height="12" border="0" align="top" title="Edit header" class="frontEndEditIcons" alt="" title="" /></a></h1><br /><img src="clear.gif" width="1" height="5" border="0" class="spacer-gif" alt="" title="" /><br /></div>
		<!--  Header: [end] -->
			
		<!--  Text: [begin] -->
			<p class="bodytext">Hallo
</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">Ich mache eon scroll... hoffe ich
</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">&nbsp;</p>
<p class="bodytext">lang genug ist das heir ja<a href="http://localhost/typo3/typo3/alt_doc.php?edit[tt_content][50]=edit&amp;columnsOnly=bodytext%2C%20rte_enabled&amp;noView=0&amp;returnUrl=%2Ftypo3%2Findex.php%3Fid%3D66"><img src="typo3/gfx/edit_fe.gif" width="11" height="12" border="0" align="top" title="Edit bodytext" class="frontEndEditIcons" alt="" title="" /></a></p>
		<!--  Text: [end] -->
			
	<!--  CONTENT ELEMENT, uid:50/text [end] -->
		 
		</div>
		<div id="unten_mitte"></div>
	</div>
```

Ausserhalb des ganzen hat Typo3 netterweise alles belassen, also vermute ich mal das Problem ist einer der Tags INNERHALB des #content.... hat irgendjemand erfahrungen mit sowas?


PS:
Also, ich habe mal etwas herumgetestet.... es ist scheibar NICHTS im inneren des bewussten div.... ich habe den code aus dem content div von der typo3-version in die "normale" kopiert... und da scrollt er!


----------



## Maik (17. April 2007)

Kann es sein, dass du hier vom IE7 sprichst bzw. mit ihm testest?

Meine Aussage von heute Mittag bezieht sich nämlich auf seine Vorgängerversionen.


----------



## superharry (17. April 2007)

vlt. kannst ja auch mal nen link zu der Page geben!
Oder du versuchst damit mal, zu probieren.
http://www.css4you.de/position.html
aber ich glaub wenn du mit solchen div-container arbeitest, kommst du um eine Browser weiche drum nicht herum!


----------



## Layna (18. April 2007)

Ja, Test war im IE7.... muss mal fragen ob hier jemand eine 6 Herumstehen hat.
Warum er nach Typo3 plötzlich nicht mehr scrollt weiss ich allerdings noch immer nicht *kopfschüttel*

Und link kann ich leider noch nicht geben... noch ist alles Lokal, die müssen hier erst den Webserver neu Starten (Typo3 will speicher), und der Servermensch ist noch nicht da.


----------



## Andreas Gaisbauer (18. April 2007)

Hallo,

hast du http://www.tutorials.de/forum/conte...eht-vorher-gut-aus-hat-nach-typo3-macken.html schon überprüft?


----------

