floyde
originele poster- 7 april 2005
- Monterrey Mexico
- 27 maart 2006
Ik heb twee div. De ene heeft een vaste hoogte en ik wil dat de andere de resterende verticale ruimte op het raam vult. Als ik de hoogte van de laatste div op 100% zet, wordt deze dezelfde hoogte als het venster, maar ik wil dat het de hoogte van het venster is minus de hoogte van de eerste div.
Dit is de code die ik gebruik:
Code: |_+_|
Ik heb ook enkele afbeeldingen toegevoegd die laten zien wat ik wil doen en wat ik tot nu toe heb kunnen doen. Bij voorbaat dank
Bijlagen
N
GeenNaamMerk
- 17 november 2005
- Halifax, Canada
- 27 maart 2006
Anders kan ik geen manier bedenken waarop je krijgt wat je wilt.
stevep
- 13 okt 2004
- VK
- 27 maart 2006
Proberen:
Document zonder titel
tot
B
C
NS
En
ps ik heb vals gespeeld door het in DW te doen, wat inhoud toe te voegen aan de tweede laag en dan te rommelen met de code - DW houdt ervan om wat opvulling rond de randen te hebben en hoewel je in de dialoogvensters kunt specificeren dat je een laag wilt hebben begin bij 0px vanuit de bovenhoek, je moet het twee keer vertellen, met behulp van de codeweergave. Ik moest toch.
floyde
originele poster- 7 april 2005
- Monterrey Mexico
- 27 maart 2006
NoNameBrand zei: Waarom de 1e niet in de 2e nesten?
Anders kan ik geen manier bedenken waarop je krijgt wat je wilt.
Bedankt, dat werkt visueel, maar de tweede div zal een container zijn voor deze lay-out, dus ik moet nog steeds de juiste afmetingen hebben zodat de inhoud ze kan erven.
Dus misschien is het gewoon niet mogelijk? Misschien moet ik een beetje javascript gebruiken om het te laten werken?
stevep zei: Probeer:Bedankt, maar ik kon het niet laten werken, welke browser heb je gebruikt?
floyde
originele poster- 7 april 2005
- Monterrey Mexico
- 27 maart 2006
Ok hier is een foto van mijn uiteindelijke doel. Tot nu toe heb ik het geleidelijk gedaan, dus misschien is het probleem mijn eerste benadering. Dus hoe zouden jullie dit aanpakken (ik heb alleen ideeën nodig)? Zou je pure css gebruiken, of zou je toegeven aan tabellen of frames?
Bijlagen
stevep
- 13 okt 2004
- VK
- 27 maart 2006
Het beetje waar je mee moet spelen is dit:
#Laag1 {
positie:absoluut;
links:0px;
boven:0px;
breedte: 100%;
hoogte:180px;
z-index: 1;
achtergrondkleur: #99CCFF;
}
Ruw je pagina op een stuk papier zodat je de juiste posities krijgt, en dat geeft je de positie van de linkerbovenhoek van elke laag. De hoogte van laag 1 bepaalt de startpositie van laag 2 - in dit geval moet laag 2 een hebbenboven:180px;regel code.
Als je de 3 lagen wilt zoals je in je laatste bericht laat zien, dan is de meest linkse laag:
#Laag1 {
positie:absoluut;
links:0px;
boven:0px;
breedte:200px;
hoogte: 100%;
z-index: 1;
achtergrondkleur: #336699;
}
en de bovenste RH-laag zal zijn:
#Laag1 {
positie:absoluut;
links: 200px;
boven:0px;
breedte: 100%;
hoogte:180px;
z-index: 2;
achtergrondkleur: #33CCFF;
}
en de 3e laag om de rest van het venster te vullen (hoe het formaat ook is gewijzigd) zou zoiets moeten zijn als:
#Laag1 {
positie:absoluut;
links: 200px;
boven:180px;
breedte: 100%;
hoogte: 100%;
z-index: 3;
achtergrondkleur: #99CCFF;
}
Het is het beste om wat dummy-inhoud in elke laag te plaatsen als u Dreamweaver gebruikt, voor het geval de laag krimpt tot niets in de paginaweergave, vandaar de 'a,b,c enz.' in de originele html hierboven.
ps ik ben geen expert, ik kan het mis hebben, maar ik hoop dat het helpt. Wat ik kan zeggen is dat mijn eerste stukje code lijkt te werken. Persoonlijk zou ik geen lagen nesten als ik kon helpen, maar dat ben ik gewoon - ik doe alleen simpel. N
GeenNaamMerk
- 17 november 2005
- Halifax, Canada
- 27 maart 2006
Hier is wat ik zou doen:
Code:
foo jij gelooft!
-
- 14 juni 2003
-
-
- MD / VA / DC
- 27 maart 2006
Deconceptie...
Bekijk FlashObject en in de download is er code om een div op volledig scherm te maken. Misschien kan het worden aangepast zoals u het wilt.
http://blog.deconcept.com/flashobject/ floyde
originele poster -
- 7 april 2005
-
-
- Monterrey Mexico
- 28 april 2006
Bedankt voor alle hulp, maar ik realiseerde me net dat de exacte lay-out die ik wil onmogelijk te bereiken is met een combinatie van vaste breedtes/hoogtes en percentages. Ik herschreef het met alleen percentages en nu werkt het. Als je geïnteresseerd bent in de opmaak laat het me weten en ik zal het plaatsen. stevep
-
- 13 okt 2004
-
-
- VK
- 28 april 2006
floyde zei: Als je geïnteresseerd bent in de opmaak laat het me weten en ik zal het posten.
Ik wil graag even kijken of je weer tijd hebt om te posten.
NoNameBrand zei: Wat is dit 'lagen' spul? is dat Dreamweaver-achtig voor 'break stuff real-good'?
Nou, ik weet niets van het 'brekende spul', maar ik denk dat je vermoedde dat ik geen CSS-boff ben - lagen zijn een handige naam die door DW wordt gegeven aan dingen waarvan ik denk dat ze 'CSS-gepositioneerde elementen' zouden moeten heten - en Ik denk dat ze ze zo noemen om mensen zoals ik met een DTP/Photoshop achtergrond zich wat comfortabeler te laten voelen. Kijkend naar de code die je in je bericht hebt opgenomen NoNameBrand, het is een stuk eleganter dan het mijne - ik zal een poging moeten doen om echt mijn hoofd rond de div-tag te krijgen. Bedankt voor de OP en de antwoorden. N GeenNaamMerk
-
- 17 november 2005
-
-
- Halifax, Canada
- 28 april 2006
stevep zei: Nou, ik weet niets van het 'brekende spul', maar ik denk dat je vermoedde dat ik geen CSS-boff ben - lagen zijn een handige naam die door DW wordt gegeven aan dingen waarvan ik denk dat ze 'CSS-gepositioneerde elementen' zouden moeten heten '
Ze hadden ook stapelbare z-indexen - die dingen van voor naar achter op een pagina plaatsen. Ik heb eerder DW-lagen gezien die een site volledig kapot maakten, maar verder heb ik er niet veel aandacht aan gehad (dat was echt genoeg).
Ik zal een poging moeten doen om echt mijn hoofd rond de div-tag te krijgen.
A is slechts een willekeurig blok - het betekent semantisch niets, zoals adoet (een alinea tekst). EENis hetzelfde idee, maar voor inline dingen (zoals a tag, maar nogmaals, semantisch vrij).
De eenvoudigste manier om dit te leren, is door Dreamweaver niet meer te gebruiken. Ik ontwerp mijn sites in Photoshop en sla de grafische elementen die ik wil op, samen met het noteren van kleurcodes en enkele ruwe pixelmetingen voor uitlijningsdoeleinden, en dan codeer ik de site in TextWrangler of VIM. floyde
originele poster -
- 7 april 2005
-
-
- Monterrey Mexico
- 28 april 2006
stevep zei: ik zou graag willen kijken of je tijd hebt om weer te posten.
Hier is het, er zit een beetje Spaans in, ik hoop dat het niet te verwarrend is:
Code:Grand Scheme html { hoogte: 100%; } lichaam { marge: 0; opvulling: 0; hoogte: 100%; breedte: 100%; } #left, #right { float: left; } #links { hoogte:100%; achtergrondkleur: oranje; breedte: 10%; } #rechts { hoogte: 100%; positie:relatief; breedte: 90%; } #top { achtergrondkleur: blauw; hoogte: 10%; } #fotos { positie: relatief; hoogte: 90%; } #foto_sup_izq, #foto_sup_der, #foto_inf_izq, #foto_inf_der { hoogte: 50%; breedte: 50%; overloop: automatisch; positie: absoluut; } #foto_sup_izq, #foto_sup_der { top: 0; } #foto_sup_der, #foto_inf_der { links: 50%; } #foto_inf_izq, #foto_inf_der { top: 50%; } 
Bijlagen
Populaire Berichten