nicht angemeldet
Brauche Hilfe: Div-Tags höhe auslesen und andere Divs anpassen
Hi Leute,
Ich bin gerade dabei eine Homepage zu basteln und habe folgendes Problem:
da ich auf das Aussehen meiner Seite sehr viel Wert lege, habe ich sie aus drei divs aufgebaut. Einen tag für links, in dem Grafiken für den linken Rand sind, einen für Rechts und einen für die Mitte, in dem der Inhalt angezeigt werden soll. Jetzt ist es so, dass ich die Grafiken per background-image einbinde, damit diese größenunabhängig angezeigt werden können.
An dieser Stelle versuche ich die viel zu kurzen seiten divs an das haupt div im punkt höhe anzupassen. Ich habe auch schon viel im Netz gesucht, aber das hat alles bei mir nicht gefunzt.
Ich sollte vielleicht noch erwähnen, dass ich garkeine Erfahrung mit javascript habe. Bisher habe ich mich mit ein wenig php, hauptteils html und css zufrieden gegeben.
okay ich pack hier einfach mal den code meiner index.html rein, dann könnt ihr am Besten sehn, was ich falsch gemacht habe.
Ich habe den divs mit css keine feste höhe zugeteilt.
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="format.css">
<script type="text/javascript">
function anpassen () {
var hoehe = divHoch("middle");
document.getElementById("left").style.height = hoehe;
document.getElementById("right").style.height = hoehe;
}
</script>
</head>
<Body onload="anpassen()">
<div id="left">
<!-- eigentlich sind hier auch noch divs drinne, die sind aber unwichtig, da ich ja das komplette anpassen möchte.-->
</div>
<div id="right">
</div>
<div id="middle"> <!--die Länge dieses Div soll ausgelesen werden-->
<div="middlemiddle">
<!-- HIER IST DER INHALT -->
</div>
<div id="bottom">
</div>
</body>
</html>
-
Hi Leute,
hallo auch
[...]
<jedi technique="mind trick">du willst kein javascript benutzen</jedi>
faux columns-
<jedi technique="mind trick">du willst kein javascript benutzen</jedi>
faux columnsDanke für die schnelle Antwort,
aber die Seite soll nicht absolut definiert sein. Das ist ja gerade der Clou. Sie soll immer Mittig sein, und die Breite des Mittleren Teils von der Fensterbreite abhängen. In etwa so wie hier http://de.selfhtml.org/css/layouts/mehrspaltige.htm#kopf_fuss. Nur, dass dann auch alle drei Bereiche die selbe Höhe haben, welche dann vom mittleren div abhäng.hans
-
<jedi technique="mind trick">du willst kein javascript benutzen</jedi>
faux columnsDanke für die schnelle Antwort,
aber die Seite soll nicht absolut definiert sein. Das ist ja gerade der Clou. Sie soll immer Mittig sein, und die Breite des Mittleren Teils von der Fensterbreite abhängen. In etwa so wie hier http://de.selfhtml.org/css/layouts/mehrspaltige.htm#kopf_fuss. Nur, dass dann auch alle drei Bereiche die selbe Höhe haben, welche dann vom mittleren div abhäng.was spricht dagegen, ein zusätzliches element einzubauen?
eines, dass den fake hintergrund für die linke spalte erzeugt und eines welches den fake hintergrund für die rechte spalte erzeugt - der rest ist transparent
das system ist hierbei ähnlich zu den runden ecken
http://guyfisher.com/workshop/css/corners/
du hast halt nicht links oben, links unten, rechts oben und rechts unten sondern nur links und rechts-
was spricht dagegen, ein zusätzliches element einzubauen?
eines, dass den fake hintergrund für die linke spalte erzeugt und eines welches den fake hintergrund für die rechte spalte erzeugt - der rest ist transparent
das system ist hierbei ähnlich zu den runden ecken
http://guyfisher.com/workshop/css/corners/
du hast halt nicht links oben, links unten, rechts oben und rechts unten sondern nur links und rechtsich habs mal hochgeladen.
http://www.noiseproduction.de.md/Neuer Ordner/
ich hab die einzelnen divs mit outline:1px solid blue; versehen, damit mans besser erkennen kann.Ich weiß, dass die andere lösung auch gut wäre, aber das geht nicht mit meinen Grafiken :(
deshalb würde ich mich freuen, wenn's mit Javascript ginge.
-
ich habs mal hochgeladen.
http://www.noiseproduction.de.md/Neuer Ordner/
ich hab die einzelnen divs mit outline:1px solid blue; versehen, damit mans besser erkennen kann.Ich weiß, dass die andere lösung auch gut wäre, aber das geht nicht mit meinen Grafiken :(
sicher gehts:
http://www.rebell.at/temp/mehrspaltig/ohne grafiken, aber durch entsprechende formatierung kann man #container und #innercontainer 2 verschiedene hintergrundgrafiken zuweisen - die eine rechts die andere links - die vom innercontainer hat zudem einen transparenten teil und die sache ist gegessen
im übrigen, das layout verwendet min-width - das funzt im ie6 nicht, aber dafür gibts hacks bzw expressions
deshalb würde ich mich freuen, wenn's mit Javascript ginge.
natürlich gehts mit javascript, aber ich will dir nicht erklären wies mir javascript geht weils schwachsinnig ist
-
sicher gehts:
http://www.rebell.at/temp/mehrspaltig/ohne grafiken, aber durch entsprechende formatierung kann man #container und #innercontainer 2 verschiedene hintergrundgrafiken zuweisen - die eine rechts die andere links - die vom innercontainer hat zudem einen transparenten teil und die sache ist gegessen
im übrigen, das layout verwendet min-width - das funzt im ie6 nicht, aber dafür gibts hacks bzw expressions
deshalb würde ich mich freuen, wenn's mit Javascript ginge.
natürlich gehts mit javascript, aber ich will dir nicht erklären wies mir javascript geht weils schwachsinnig istokay.
es geht fast: http://www.noiseproduction.de.md/Neuer%20Ordner/
Problem ist, dass die grafiken anner Seite nicht angezeigt werden.schonmal dankeschön bis hier!
hab erst verstanden, was mit fake-hintergrund gemeint war, als ich den recht simplen code gesehn hab.hans
-
es geht fast: http://www.noiseproduction.de.md/Neuer%20Ordner/
du hast mein markup kopiert und verwurstet, das ist nicht mehr valide und du traust dich im ernst sagen "es geht fast" - das bringt den kleinen jesus in mir zum weinen ;)
Problem ist, dass die grafiken anner Seite nicht angezeigt werden.
schonmal dankeschön bis hier!
hab erst verstanden, was mit fake-hintergrund gemeint war, als ich den recht simplen code gesehn hab.die divs links/rechts brauchst du in container und inner container nicht - dort wendest du faux columns bzw eine abwandlung davon an
sprich
#container und #innercontainer bekommen jeweils die grafik für links bzw rechts und zusätzlich bekommt #container die allgemeine hintergrundfarbe (dieses rot#container {
background: #AD0000 url(Bilder/mittelinks.jpg) repeat-y left;
}#innercontainer {
background: url(Bilder/mitterechts.jpg) repeat-y right;
}-
du hast mein markup kopiert und verwurstet, das ist nicht mehr valide und du traust dich im ernst sagen "es geht fast" - das bringt den kleinen jesus in mir zum weinen ;)
das hast du aber schön gesagt ^^
die divs links/rechts brauchst du in container und inner container nicht - dort wendest du faux columns bzw eine abwandlung davon an
sprich
#container und #innercontainer bekommen jeweils die grafik für links bzw rechts und zusätzlich bekommt #container die allgemeine hintergrundfarbe (dieses rot#container {
background: #AD0000 url(Bilder/mittelinks.jpg) repeat-y left;
}#innercontainer {
background: url(Bilder/mitterechts.jpg) repeat-y right;
}Super! Danke für die Geduld und alles andere! Iss echt toll hier.
Funzt super. Und das alles OHNE js. Hätte ich nie gedacht.falls du nochmal gucken magst ;) (link steht noch)
a happy
Hans-
falls du nochmal gucken magst ;) (link steht noch)
sieht gut aus - allerdings solltest du jetzt noch das stylesheet in eine eigene datei auslagern, so ist nicht unbedingt schön gelöst wenn das css im <head /> liegt
-
-
-
-
-
-
-
-