nicht angemeldet
dynamische Breite & Höhe + Fusszeile
Hallo Liebes SelfHTML Forum,
ich suche jetzt schon die letzte Woche nach einer Lösung für mein derzeitiges Web-Project. Aber irgendwie scheine ich die falschen Fragen an google zu stellen. Hab zwar schon ein paar Ansätze gelesen ... aber so richtig passt keiner zu mir .. bzw haben mich manche "löungen" mehr verwirrt.
Hier ist mein Sorgenkind : http://tinyurl.com/5ho78w
Ist eine Joomla! gestützte Website für ein befreundetes Unternehmen - und ich arbeite wiedermal weit entfernt von "profitabel" ;)
(Schaut euch die Site am besten in Firefox + Firebug an - im Content Bereich gibts (noch) Probleme)
Mein Ziel ist ein komplettes "Liquid-Layout" sprich die Breit und Höhe der Website passen sich dynamisch an das Browserfenster an.
Das mit der Breite funktioniert auch schon "herrlich" bzw so wie ich es gern hätte mit 85% Breite + min & max-width + margin auto links und rechts.
Der ContentBereich hat das attribut "overflow:auto" und zeigt bei Bedarf Scrollbalken an.
So das selbe hätte ich jetzt auch gerne für die Höhe ... mit dem gleichen Verhalten wie die Breite ... sprich es verändert sich nur die Breite und Höhe des mainContent div's ... und es wird in der Linken Navigationsspalte (sidebar1) mehr oder weniger vom Hintergrundbild angezeigt (so wie im Header)
Ich erwarte jetzt nicht das mir jemand meine Layout fertigstellt ;) (wobei .. wehren tät ich mich auch nicht *g*)
Aber bitte die "Cracks" des Forums hier um ein oder mehrer Denkanstösse wie ich zum Ziel kommen könnte (von mir aus und wenn nötig auch mit Hilfe von JavaScript)
Hier ein link zu einem jpg vom PhotoshopLayout --> http://test.photografx.eu/LEEBlayout_v7.jpg zur besseren Visualisierung wie das ganze zB auf nem Monitor mit 1200px Höhe aussehen könnte/sollte ...
Vielen Dank im Voraus
AlexxJ
-
Hallo,
Setze top auf 10% und bottom auf 10%, genau kannst solltest du es mit left und right machen und nicht mir left und width...
mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...-
Hallo,
Setze top auf 10% und bottom auf 10%, genau kannst solltest du es mit left und right machen und nicht mir left und width...
mfg, Flo
???? *g*
Bitte nochmal langsam ... was soll ich wo setzen und was habe ich dann davon ??
lg
Alexx
-
Hallo,
mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...-
Hallo,
erstaml danke mal für den link ... ist gebookmarkt ...
also mein layout basiert auf floats ... (falls Du es Dir angesehen hast)
bla .. ;
blah! :)
Alles in Allem brauch ich grad kein Tutorial für CSS-Layout ... das kann ich mittlerweile ein bisschen ... sondern "einfach" (ich weiss das es das nicht ist) ein kleine Hilfestellung was dynamische Höhen von DIV's in HTML betrifft ...
mfg, Flo
lg
AlexxJ-
Hallo,
also mein layout basiert auf floats ... (falls Du es Dir angesehen hast)
Dann erreichtst du nur ganz schwer "volle Höhe"
mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...-
Hallo,
also mein layout basiert auf floats ... (falls Du es Dir angesehen hast)
Dann erreichtst du nur ganz schwer "volle Höhe"Das ist ja das Problem .. ich will keine "volle höhe" ...
ich hätte gerne das es ganaus funktioniert wie bei der breite ... sprcih das die höhe des Containers immer 85 Prozent der Fenterhöhe hat ...Es soll/darf keinen scrollbalken im Hauptfenster geben .. den einzigen scrollbalken möcht ich im Content bereich sehen ;)
Wie schon im Anfangsthread gesagt ... ich brauch keinen der mir mein Layout programmiert ... sondern einfach KONSTRUKTIVE Vorschläge wie es sich bewerkstelligen ließe
mfg, Flo
lg
AlexxJ
-
-
-
-
-
-
Liebes Forum ...
Hat vielleicht jemand von euch konstruktivere Vorschläge / Kritik
... wie ich mein Layout dynamisch der FensterHÖHE anpasse ?
lg
AlexJ
-
Hallo,
Ja!!
html:
<div id="motherdiv"> <div id="links">z.B. Navigation</div> <div id="rechts">z.B. Sidebar</div> <div id="content">Die ID sagt's schon: Lorem ipsem dolor sit amet, ...</div> </div>Css:
#motherdiv { position : absolute; top : 5em; bottom : 5em; left : 10em; right : 10em; border : 1px solid red; /*For debugging*/ } #links { width : 12em; position : absolute; left : 0; top : 0; bottom : 0; border : 1px solid lime; /*For debugging*/ } #rechts { width : 12em; position : absolute; right : 0; top : 0; bottom : 0; border : 1px solid orange; /*For debugging*/ } #content { position: absolute; left : 12em; right : 12em; top: 0; bottom: 0; border: 1px solid blue; /*For debugging*/ }Da hier nicht mit Floats gearbeitet wird, kannst du die divs aus SEO-Gründen noch anders anordnen, also z.B. den Content vor die Sidebar.
Im FF funktionierts auf jeden Fall (IE hab ich nicht getestet, weil ich zu faul war, den richtigen DOCTYPE rauszusuchen und ohne kannste dich nich drauf verlassen :=), Chrome auch -> damit auch Safari, und Opera dürfe auch funktionieren.mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...-
hey!
sry hab deinen Postniochjt gleich gefunden ...
danke jedenfalls ... ich wer mich mal damit spielen ...
bis in Bälde ;)
Alexx
-
W-O-W ! :)
I LOVE U !!! :) :) :)
ich habe es jetzt noch nicht ins Design eingebaut ...
aber mal mit den Div's erweitert die ich für mein Layout brauche ...
... es scheint so zu funktionieren wie ich es mir vorstelle!-> http://test.photografx.eu/liquidlayout
FireFox zeigt es korrekt an
Internet Explorer 7.0 auch
Safari 3
Opera 9 macht probleme ... vielleicht falsche Doctype ?ein problemchen fällt mir auf ...
wenn ich eine max-width für den Container einstelle ... haut es mit der zentrierung leider nicht mehr hin :(
wer mich noch ein bisschen damit beschäftigen ...
aber ... U made my daythanxxx
Alexx
-
Hallo,
W-O-W ! :)
I LOVE U !!! :) :) :)
aber ... U made my dayGut, dass noch ein PC dazwischen ist :D
mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen... -
Hallo,
Opera 9 macht probleme ... vielleicht falsche Doctype ?
Ich sehe keine Probleme:
mfg, Flo
--
Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
*Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen... -
Hi,
wieso bezeichnst Du dies als "liquidlayout"? Das ist es nun wirklich nicht.
Vergrößere Deinen Schriftgrad und es kommt zu Überlagerungen.
Oder verkleinere die Fensterbreite und der Inhalt wird bis zum völligen Verschwinden zusammengestaucht.
Ich habe da viele fixe Layouts gesehen, die weit weniger problematisch waren.freundliche Grüße
Ingo
-
-
-