ugrás a tartalomhoz

Bal es jobb szelekhez simulo hatter CSS-ben

balage020 · 2006. Szep. 14. (Cs), 21.08
sziasztok!

nem olyan regota kezdtem ismerkedni a css-sel, es beleutkoztem egy elegge idegesito problemaba.
utanaolvastam de nem talaltam kielegito valaszt ra.

az oldalamnak van egy kozepso, 768px szeles resze, amiben fejlec, tartalom, menu, lablec van...fix szelesseggel.
a hatteret szeretnem megvalositani, ez egy keskeny y tengelyen ismetlodo kb 150px szeles kep, pontosabban 2, egy normal valtozat es egy horizontalisan tukrozott verzio. az egyik kep a bongeszo bal szelehez kellene igazodjon, jobb szele fokozatosan atmegy feherbe, ezzel beleolvadva az amugy feher hatterbe, a masik kep a jobb szelhez lenne pontosan igazitva. mindketto emelett felulre is lenne egyben igazitva.
ha a felbontas no, a kozepso resz mindig kozepre igazodna, fix szelesseggel, de a ket hatterkep egyre tavolodna a kozepso tartalomtol, ertelemszeruen,mivel hozza vannak ragasztva a bal es a jobb szelehez a bongeszonek.

tablazattal ugyebar nem nagy szam megcsinalni.

jelenlegi megoldasom:
/*#bal {width:201;
position: absolute;
left:0;
top:0;
background-image:url('./images/balsav.jpg');
background-repeat:repeat-y;}

#jobb {width:191;
position: absolute;
right:0;
top:0;
background-image:url('./images/jobbsav.jpg');
background-repeat:repeat-y;}*/

kerdesem az lenne meg, hogy ha a width-et auto-ra allitom mind2 esetben ,akkor a fix kozepso resztol fuggetlenul a #bal es #jobb tartalom szelessege a felbontas fugvenyeben valtozik?

volt mar itt egy masik megoldas, egy pl 1600-szeles hatterkep, ami a nagyobb felbontasnal is jo lenne...de annal a kepek szinten szelekre igazodnak, es igy kisebb felbontasnal nem latszanak...

segitsetek! hogyan oldjam meg?
nem baj, ha az oldalso kepek nem ugyanolyan magasak mint a kozepso resz aktualis magassaga, csak ne legyen "alacsonyabb, rovidebb" annal.

elore is koszi,
Balazs
 
1

2 egymásban lévő elem

Jano · 2006. Szep. 14. (Cs), 21.46
2 darab 100% széles elemre van szűkséged amik egymásban vannak. Ha szabvány módban vagy (doctype switch) akkor a HTML és a BODY elem egyből rendelkezésre áll (vedd nullára a margin és padding tulajdonságot), ha nem akkor a BODY-n belülre kell tenned egy plussz DIV-et. Ezután az egyik hátteret a külső, másikat a belső elemnek adod meg. Ismétlést, poziciót beállítod.

Ez a megoldás lényegében ugyanaz mint a Sliding door technika a fülekre.
2

koszi!

balage020 · 2006. Szep. 14. (Cs), 22.39
en idokozben odaig jutottam hogy adtam mindkettonek egy nagyjabol a kozepresz magassagahoz hasonlo height erteket, es kesz...firefox es ie alatt nincs egyelore gond..

a te megoldasod viszont nagyon jo! most mar eszembe jutott, ez volt a dobozolasi technikak masodik feleben emlitett peldaban is a weblabor css tanfolyamaban.

koszi szepen a segitseget!

Balazs
3

csak nem akar jo lenni...

balage020 · 2006. Szep. 14. (Cs), 22.55
atneztem ujra a dobozolasos cikket...

#bal {width:100%;
height:1090px;
background-image:url('./images/balsav.jpg') left;
background-repeat:repeat-y;
}

#jobb {width:100%;
height:1090px;
background-image:url('./images/jobbsav.jpg') right;
background-repeat:repeat-y;
}

illetve:

<div id="bal">
<div id="jobb">
</div>
</div>


nem jelenik meg semmi a bongeszoben..:(((
4

background position

Grandmaster · 2006. Szep. 15. (P), 09.26
A megadott
background-image:url('./images/jobbsav.jpg') right; 
szintaktikailag nem helyes. A background-image tulajdonsagnal ne legyen poziciora vonatkozo ertek. Tovabba nezd meg, hogy a css fajlhoz viszonyitva a kepek ott vannak, ahol megadtad oket.
5

mukodik..

balage020 · 2006. Szep. 15. (P), 09.34
koszonom szepen.