ugrás a tartalomhoz

3 hasáb formázása Css -ben.

Matyi Gábor · 2007. Aug. 12. (V), 20.07
|--------------------------------------|
| header header headerrrr |
---------------------------------------|
| bal | jobb jobb jobb jobbb |
| bal |-------------------------------|
| bal | balkozep | jobbkozep |
|--------------------------------------|
| lablec lablec lablec lablec |
|--------------------------------------|


sziasztok, egy ilyen képernyőkinézetet próbálok css-ben megformázni, sehogy sem sikrül. A float: left és right-al próbálkozom, illetve definiálom az egyes "div" -ekhez tartozó oszlop szélességeket. Az egyik probléma, hogy a balo oldali oszlopban található menu, rövidebb, mint a balkozep és jobbkozépben található tartalom, igy a balkozép belóg a bal oldal alá. A másik gond, hogy a lábléc bekerül a bal és a jobb közé.

Kérlek segítsetek.
‹ Ajaxal JS küldése CDATA manipulálás JavaScripttel ›
 ■
1

talán ilyenre gondoltál

solkprog · 2007. Aug. 12. (V), 21.23
Nem tudom hogy ilyenre gondoltál-e. Nekkem ez jött le hogy ezt akkarod. Ha nem akkor mond mit értetem fére.
Egyébként meg saját kódot mellékelhetél volna.
Hát én szivem szerint nem így neveztem volna el a dolgokat. balkozep, bal, jobb stb. de mindegy.
css rész:
  1. #fejlec,#lablec,.bal,.jobb,.balkozep,.jobbkozep{  
  2.     border: 1px solid #000;  
  3.     }  
  4.     .balkozep{  
  5.         float: left;  
  6.     }  
  7.     #lablec {  
  8.         clear: both;  
  9.     }  
  10.     .balkozep {  
  11.         width: 50%;  
  12.     }  
  13.     .tartalom{  
  14.         float:Right;  
  15.         width: 80%;   
  16.     }  
html része:
  1. <div id="fejlec">fejlec</div>  
  2. <div class="tartalom">  
  3.     <div class="jobb">jobb</div>  
  4.     <div class="balkozep">balkozep</div>  
  5.     <div class="jobbkozep">jobbkozep</div>  
  6.     </div>  
  7.     <div class="bal">bal</div>  
  8. <div id="lablec">lablec</div>  
2

Szerintem másra gondolt.

szabozee · 2007. Aug. 17. (P), 18.55
Rengeteg kész css template van, elég rákeresni a google-val a css template szavakra, és mindenféle elrendezésre van kész megoldás.
Amit nem ért, az, hogy miért lóg "bele".
Ennek két oka szokott lenni, az egyik a position:relative/absolute hiánya, vagy rossz használata, a másik pedig, hogy praktikus egy-egy clear sort iktatni a blokkok közé.
  1. .clear {clear: both; width: 100%; height: 1px; font-size: 1px; }  
  1. <div class="clear"></div>  
3

válasz

dog · 2007. Aug. 18. (Szo), 14.01
Ilyen template történetesen van a dreamweaverben is, ctrl+N és kiválasztod a listából.
bocs véletlen privátként küldtem el, rossz gombot nyomtam.