Main Div soll Scrollbar bekommen wenn zu eng
WernerK
- css
Hallo,
Auf einer PHP Seite habe ich ein Main Div.
Darin links ein weiteres div mit einer Art Navigation im Treeview Look.
Klickt man auf einen Link öffnet sich ein Unterlink wenn vorhanden. Diese Navigation kann also nach rechts wandern in der Breite.
Daneben ein weiteres Div mit einer JobListe. Dies ist ein <Select> das sich auch dynamisch verbreitern kann, je nach Konfiguration.
Soweit klappt es auch. Das Problem ist nur:
Wenn das <Select> zu breit wird oder die Navigation zu viele Untermenüs hat und zu breit wird, dann verschiebt sich das zweite Div bzw. das Select nach unten und macht einen Umbruch.
Ich würde gerne im Main Div eine Scrollbar anzeigen wenn die Breite nicht für das Browserfenster ausreicht.
Ich habe es versucht mit "overflow:auto;" im Main Div aber es kommt keine Scrollbar.
Hat jemand eine Idee?
<div class="MainDiv">
<div id="DirlistNavigation">
<?php
include('include/dirtabs.inc.php');
?>
</div>
<div id="SelectList">
<?php
include('include/selectlist.inc.php');
?>
</div>
</div>
.MainDiv{
overflow:auto;
position:absolute;
top:170px;
left:1px;
/*width:auto;*/
background:#C0F;
}
.MainDiv div {
float:left;
}
#DirlistNavigation{
width:auto;
}
#SelectList{
background:#FF3;
/* width:auto;*/
}
Gruss
werner
Hi,
Ich habe es versucht mit "overflow:auto;" im Main Div aber es kommt keine Scrollbar.
Natürlich nicht - wenn du keine Maße angibst, bei deren Überschreitung Scrollbalken genutzt werden sollen, werden auch keine genutzt.
MfG ChrisB
Hallo,
Natürlich nicht - wenn du keine Maße angibst, bei deren Überschreitung Scrollbalken genutzt werden sollen, werden auch keine genutzt.
das habe ich auch schon versucht.Auch wenn ich dem Main Div eine feste breite vorgebe. Dann kommt zwar der Scrollbalken aber das zweite Div mit dem <Select> wird umgebrochen wenn der Platz nicht reicht und erscheint dann unter der Navigation
.MainDiv{
overflow:auto;
position:absolute;
top:170px;
left:1px;
width:80em;
background:#C0F;
}
Gruss
Werner
Om nah hoo pez nyeetz, WernerK!
Zeig doch mal.
Matthias
Hallo,
Zeig doch mal.
geht nicht ist eine reine Intranet Lösung
Gruss
Bzw. man kann es ganz einfach so nachvollziehen:
Das Main Div aist auf 20em in der Breite begrenzt. Im "JobList" Div ist ein überbreiter Inhalt.Der Scrollbalken erscheint nun zwar, aber der Inhalt wird trotzdem umgebrochen. Der pinkfarbige Inhalte mit den vielen "xxxx" erscheint nun unter dem linken "Navigation" Div.
Das möchte ich vermeiden. Es soll immer daneben erscheinen.
<div class="MainDiv">
<div id="DirlistNavigation">
NAvigation
</div>
<div id="JobList">
Joblist xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
</div>
</div>
.MainDiv{
overflow:auto;
position:absolute;
top:170px;
left:1px;
width:20em;
}
#DirlistNavigation{
background:#3F9;
float:left;
width:auto;
}
#JobList{
background:#F3F;
}
Hi,
Wenn das <Select> zu breit wird oder die Navigation zu viele Untermenüs hat und zu breit wird, dann verschiebt sich das zweite Div bzw. das Select nach unten und macht einen Umbruch.
So wie Du es ja auch haben willst.
Warum sonst hättest Du
.MainDiv div {
float:left;
}
angegeben?
cu,
Andreas
--
[Warum nennt sich Andreas hier MudGuard?](http://MudGuard.de/)
[O o ostern ...](http://ostereier.andreas-waechter.de/)
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
Hallo,
So wie Du es ja auch haben willst.
Ja, das hatte ich mir auch schon überlegt und habe daher nun das "float:left" aus dem Main div rausgenomme und in das "Navigation Div" rein.
Trotzdem der gleiche Effekt.
Wie aber kann man es erreichen das die Divs nebeneinander erscheinen aber nicht umgebrochen werden wenn der Inhalt zu breit ist?