Maßangaben berechnen
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
absolute berechnung
anweisung
berechnen
code
dimension
ergebnis
fenster
folgendes code
halbe stunde
idee
jemand
links mitte
methode
plazieren
problem
rechts code
server
stehenden platz
url
versuchen
-
Vorausgesetzt, ich möchte drei DIVs nebeneinander platzieren. Dabei weiß ich, wie breit das erste und letzte DIV sind, aber das mittlere DIV soll dann den restlichen zur Verfügung stehenden Platz ausfüllen. Rein theoretisch würde das ja über eine Anweisung folgender Art funktionieren (leider geht das nicht):
Nun versuche ich schon lange Zeit ohne Erfolg, wobei die vielversprechendste Methode folgendes war:width: 100% - breiteLinks - breiteRechts;
Allerdings wird dadurch die Breite des DIVs nicht beeinfluss, das heißt, dass das linke DIV jetzt zwar angezeigt werden kann, aber das Mittlere ist immernoch zu breit...width: 100%; margin: breiteLinks 0 breiteRechts;
Hat jemand eine Idee, wie ich so ein Problem lösen kann?
Ach ja: Ich möchte das nicht über JavaScript lösen!
Beitrag zuletzt geändert: 24.3.2012 14:17:04 von toolz -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
hm, vielleicht die divs ineinander verschachteln?
<div linksausgerichtet 50px breit></div>
<div linksausgerichtet padding-links 50 px; 100 % breit><div rechtsausgerichtet padding-rechts 50 px; 100 % breit></div></div>
<div rechtsausgerichtet 50 px breit></div>
Aber so würde ich es versuchen, hab's nicht versucht -
Also mit PHP geht es soweit ich weiß nicht, weil der Browser zu wenige Infos an den Server schickt, außerdem kann sich die Dimension des Fensters verändern, also dürfte die Absolute Berechnung mit JS eigentlich die einzige Möglichkeit sein, die mir einfällt, wobei deaktiviertes JS natürlich zu Problemen führt :/
aber sonoks Vorschlag sieht vielversprecend aus, wenn man es in nicht-pseudo-Code umwandelt ;) -
toolz schrieb:
[...]
wobei die vielversprechendste Methode folgendes war:
Allerdings wird dadurch die Breite des DIVs nicht beeinfluss, das heißt, dass das linke DIV jetzt zwar angezeigt werden kann, aber das Mittlere ist immernoch zu breit...width: 100%; margin: breiteLinks 0 breiteRechts;
Kann ja auch nicht, da:
Gesamtbreite = Width + Padding (Innenabstand) + Border (Rahmen) + Margin (Außenabstand)
Hat jemand eine Idee, wie ich so ein Problem lösen kann?
Ich habe jetzt eine halbe Stunde rumprobiert, mein Ergebnis ist folgendes:
<div style="width:100%;overflow:hidden;"> <div style="float:left;width:200px;"> <p style="border:1px solid red;">links</p> </div> <div style="float:left;width:100%;margin-left:-200px;margin-right:-200px;"> <div style="width:100%;margin-left:200px;margin-right:200px;"> <p style="border:1px solid green;">mitte</p> </div> </div> <div style="float:right;width:200px;"> <p style="border:1px solid blue;">rechts</p> </div> </div>
Beim mittleren Div gleichen sich die margin 200px / -200px wieder aus, funktioniert ohne diesen aber nicht. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage