[CSS] Variabele lengtes in CSS, en een scrollbar

[anoniem]

Ik heb het volgende probleem, ik ben hier bezig met een website die ik ga maken in CSS, nu is het zo dat de boxen, left01, left02, left03 en footer01 links moeten uitlijnen. nav, topright en bottomright moeten rechts uitlijnen. Nu wil ik graag dat de box menu een variabele breedte krijg. het zelfde geld voor de box content, maar deze box moet zowel in de breedte als in de hoogte variabel zijn. Box left03 moet in de breedte vast staan maar in de lengte variabel zijn. De boxen content, nav en left03 moeten aan de onderkant even lang zijn, en stoppen bij footer. Footer moet onderaan de pagina staan, waarvan box footer01 links moet uitlijnen, box bottomright rechts. De box footer02 moet een variabele breedte hebben die het uitvult tot bottomright. Ik vraag me af of ik de footer boxen een vaste plaats moet geven of dat ze automatisch met de box content mee kunnen zakken. Wanneer de tekst te veel word in de box container moet daarin een scrollbar komen. Een heel verhaal met hierin veel problemen, heeft iemand misschien suggesties? klik hier om het te bekijken: http://217.120.106.102/test/ Bedankt Roman :oops:

[anoniem]

Wat wil je nu precies aan [url=http://www.planetdust.nl/roman.html]deze[/url] veranderen? Alinea's lezen trouwens een stuk fijner en een plaatje zegt meer dan duizend woorden (en je kunt het nog sneller begrijpen).

[anoniem]

ok, ik heb nu de plaatjes erbij gezet, misschien dat het nu duidelijker is. Over die alineas, ja dat klopt ik had geplakt vanuit notepad, blijktbaar gooit hij er dan enters tussen 8)

[anoniem]

Een totaalplaatje met de complete layout :wink: (met eventueel nog even aangegeven waar je welke div in gedachten had)

[anoniem]

[code:1:b3f5d622cc]#menutekst{ font: 14px verdana; color: orange; } #container{ width: 900px; margin: 0px; margin-left:auto; margin-right:auto; position:relative; background-color: #000000; } #menu{ position: absolute; width: 344px; top: 0px; left: 283px; background-color: #ffffff; height: 32px; } #topright{ position: absolute; left: 627px; top: 0px; width: 149px; background: #cc0066 url(right01.gif) no-repeat fixed; height: 32px; } #left01{ position: absolute; width: 283px; top: 0px; left: 0px; background: #ffffff url(left01.gif) no-repeat fixed; height: 70px; } #left02{ position: absolute; width: 283px; top: 70px; left: 0px; background: #ffffff url(left02.gif) no-repeat fixed; height: 176px; } #left03{ position: absolute; width: 283px; top: 246px; left: 0px; background: #ffffff url(left03.gif) no-repeat fixed; height: 176px; } /*#content{ top: 43px; left: 283px; position: absolute; height: 348px; width: 344px; background-color: #FF0099; }*/ #content{ top: 43px; clear: right; background-color: #FF0099; } #nav{ top: 32px; left: 637px; position: absolute; height: 359px; width: 139px; background-color: #33CC00; } #footer01{ top: 391px; left: 0px; position: absolute; height: 42px; width: 283px; background: #666666 url(footer01.gif) repeat fixed; } #footer02{ top: 391px; left: 283px; position: absolute; height: 42px; width: 344px; background: #666666 url(footer01.gif) repeat fixed; } #bottomright{ top: 391px; left: 627px; position: absolute; height: 40px; width: 149px; background: #ff0000 url(right04.gif) no-repeat fixed; } #navactive{ top: 100px; left: 627px; position: absolute; height: 348; width: 10px; background-color: #FFFFFF; } #menuactive{ top: 32px; left: 283px; position: absolute; height: 10px; width: 344px; background-color: #666666; } html,body{ width:100%; margin:0px; padding:0px; }[/code:1:b3f5d622cc]

[anoniem]

Zo wordt het nog steeds niet duidelijk _wat_ je wilt bereiken. Het posten van een screen shot en wat CSS code heeft weinig nut, dat kan iedereen zelf wel bekijken (kun je ze weer weghalen?). Waarom bestaat de linkerkant uit 3 divs? Toch niet omdat het verschillende plaatjes zijn of wel? Want dan zou je die net zo goed kunnen samenvoegen. Je moet denken in structuur niet in "hoeveel plaatjes zal ik hiervan maken". Verder, heeft het geheel een vaste breedte? Is de hoogte vast?

[anoniem]

als je mijn eerste post even wilt lezen :) En ja, dat zijn 3 verschillende plaatjes, in totale grootte kleiner dan 1 plaatje. ze zijn hier even vaag gemaakt,. De breedte staat niet vast, maar de uitlijning van de linker divs en de rechter divs. Wanneer er veel tekst in de content staat moeten de footers mee naar beneden zakken, foter02 moet een variabele breedte hebben. Ik ga even eten, brb

[anoniem]

sorry anne, hoe moet ik het vragen? Ik merk dat mijn vraagstelling niet overeen komt met waarop jij antwoord :-? Ik denk toch dat ik het juist heb gevraagt :o

[anoniem]

Ah, je hebt het door :wink: Wat ik eerder zei, een plaatje zegt meer dan duizend woorden duidde er niet op dat ik een screen shot of iets dergelijks wilde, maar een plaatje van de layout die jij in photoshop of een dergelijk programma hebt geproduceerd. Een layout i.c.m. met inhoud beschrijving is namelijk veel handiger om te hebben dan de manier waarop jij denkt hoe de structuur eruit gaat zien. Vanuit een layout en inhoud kan ik veel sneller bedenken welke technieken er eventueel nodig zijn. Daarnaast is je beschrijving in de topicstart niet echt goed. Niemand gaat termen onthouden als 'left03' etc. Zeker niet als het er erg veel is. En als je het toch op die manier wilt vertellen, moet je het anders brengen, bijvoorbeeld: "De layout bestaat uit drie kolommen en een footer. De middelste kolom blijft flexibel en de twee kolommen aan de zijkant hebben een vaste breedte van ieder 200px. De linker kolom is onderverdeeld in 3 kleine boxjes. De bovenste twee hebben een vastgestelde hoogte en de onderste groeit mee met de hoogte van de totale inhoud. Et cetera."