✔ 2 DIVs nebeneinander in einem Variablen DIV..

[String]

Servus,

ich suche nun schon lange und habe auch schon viele ähnliche Probleme gefunden.. Aber leider hat keine Lösung bei mir geholfen.

Vielleicht ist es auch einfach nicht möglich..hier einfach mal mein HTML-Code:

 <div style="width:300px; height:300px; position:absolute; background-color:#FFFF00">

<div style="width:100px; float:left; position:absolute; background-color:#00CCFF"> MENU </div>
<div style="background-color:#006666;  width:100%; margin-left:110px; position:absolute;">weiterer inhalt</div>

</div>

Problem ganz einfach:
Der Div "weiterer inhalt" steht über dem gesamt hinaus. Logisch, da er 110px von der linken seite weg stehen soll aber auch gleichzeitig 100% Breit.

Doch, wie kann ich es Lösen das er abstand vom Linken DIV hat und den kompletten restlichen, rechten Rand ausfüllt?

Mit Pixelangaben kann ich leider nicht arbeiten, da der "große"-DIV eine variable breite hat, also nicht immer 300px Breit ist. Der "Menu"-DIV hingegen ist IMMER 100px breit.

Hoffe jemand kann mir helfen.

PS: Hintergrundfarbe ist nur dabei um es ein wenig "Übersichtlicher" zu halten.

Danke im Voraus
paD

 

[prm]

indem du auf die absoluten Positionsangaben und den width-Wert verzichtest:

 <div style="width:300px; height:300px; background-color:#FFFF00">

<div style="width:100px; float:left; background-color:#00CCFF"> MENU </div>
<div style="background-color:#006666;  margin-left:110px; ">weiterer inhalt</div>

</div>

 

[String]

:suspekt: kann ja mal echt nicht Wahr sein.
So einfach.. und es Funktioniert.. 1000-dank!

 

[String]

2 DIVs nebeneinander mit verschiedenen Höhen in einem DIV

Servus,

da mir nun mit meinem anderen Thema so super schnell geholfen wurde. Hoffe ich das es vielleicht hier genau so schnell geht.

<div style="width:300px; height:300px; background-color:#FFFF00; padding:5px;">
<div> TEST </div>

<div style="width:100px; float:left; background-color:#00CCFF"> MENU </div>
<div style="background-color:#006666;  margin-left:110px; height:100%; overflow:scroll;">weiterer inhalt</div>

</div>

Mein Problem:
Durch den "TEST"-DIV werden beide DIVs nach unten verschoben (wie gewollt).
Allerdings hängt nun der "weiterer inhalt"-DIV bei 100% über den "HauptDiv".

Kann mir da auch jemand abhilfe schaffen?

Danke im Voruas
paD

 

[Maik]

Hi,

das liegt in den standardkonformen Browsern an der height-Deklaration für das übergeordnete DIV, da diese Eigenschaft von ihnen als fixe Höhe behandelt wird.

mfg Maik

 

[String]

Hi,

das liegt in den standardkonformen Browsern an der height-Deklaration für das übergeordnete DIV, da diese Eigenschaft von ihnen als fixe Höhe behandelt wird.

mfg Maik

Und das kann man nicht irgendwie umgehen?
Mir ist klar, dass er die 100% von den 300px höhe nimmt ohne die höhe vom "TEST".Div abzuziehen.. Aber mir geht es ja genau darum, dass zu verhindern.

paD

 

[Maik]

Wenn das Elternelement eh eine feste Höhe besitzt:

<div style="width:300px; height:300px; background-color:#FFFF00; padding:5px;">
<div> TEST </div>

<div style="width:100px; float:left; background-color:#00CCFF"> MENU </div>
<div style="background-color:#006666;  margin-left:10px !important; margin-left:110px; height:280px; overflow:scroll;">weiterer inhalt</div>

mfg Maik

 

[String]

Ouh sry hatte ich total vergessen zu schreiben.
Die Höhe ist auch Variable.

Heißt also, der Benutzer gibt Breite wie Höhe für den Hauptdiv an.
Der DIV über den beiden (Menü und Inhalt-DIvs) ist immer da.
Menu ist immer gleich - und der Rechte von beiden soll den gesamten Rest ausfüllen.

paD

 

[Maik]

Dann musst du aber die height-Deklaration für die standardkonformen Browser (Firefox, Netscape, Opera, Safari, usw.) "entfernen", da sie, wie schon von mir erwähnt, von ihnen als feste Höhe behandelt wird, sprich da ist in dieser "Konstellation" nichts mit einer variablen Höhe.

mfg Maik

 

[String]

Ja, dann füllt er den Rest nach links und rechts schön aus, aber nach unten hin ist halt leer.

Soll eine Art "miniFrameSet" werden. Ein kleines, verschiebbares Fenster, in Höhe sowie Breite verschiebbar.

Links Menü, Rechts Inhalt, der, wenn er zu lang ist, scrollbar wird.

Irgendwie muss das doch gehen, oder?

paD