Autor | Zpráva | ||
---|---|---|---|
Knopi Profil |
#1 · Zasláno: 10. 3. 2007, 11:49:01
Ahoj, aby bylo na srozuměnou.
- Zelený blok, bude v normálním toku dokumentu. (nesmí být pozicován) - Čevený blok bude mít pevnou šířku a výšku, musí být pod zeleným. Ten Zelený blok nebude mít pozadí, takže červený blok pod ním bude vidět - ten růžek co se překrývá. Asi se ptáte, proč chci cpát ten červený blok pod. Bude se v něm měnit obrázek. Řešením by také bylo ho prostě umístit jako pozadí rodičovskému bloku, jenže je to podněkud komplikované. Ty obrázky co se budou měnit budou sloučené - bude to jeden dlouhý obrázek, proto to musí být v tom bloku, zbytek bude schovaný. Pokoušel jsem se to nějak udělat absolutním pozicováním, jenže bez úspěchu. Když dám záporný z-index, tak blok napříč prohlížeči zcela zmizí. Budu rád za každou radu. Děkuji. Ilustrační obrázek: |
||
xthomas Profil |
#2 · Zasláno: 10. 3. 2007, 12:14:39
no jestli proste potrebujes to aby byl v rohu zeleneho vidět roh červeneho, tak ten červený můžeš proste napoziciovat s kladnym z-indexem nad něj, ne?? nebo jde o nejaky border u zeleného prvku?
|
||
Knopi Profil |
#3 · Zasláno: 10. 3. 2007, 12:29:23 · Upravil/a: Knopi
xthomas: Musí být pod a vcelku červený blok, protože v zeleném bloku bude text, který by se schoval by se pod ten červený blok, kdyby byl výše, jak radíš. Proto potřebuji, aby byl červený blok vespod.
Pokoušel jsem se o to nějak takto: css: #box { background: red; width: 300px; height: 320px; position: absolute; right: 0; top: 0; z-index: -1; } |
||
xthomas Profil |
#4 · Zasláno: 10. 3. 2007, 13:03:48
to půjde ten text pres roh obrázku v červenem bloku? tomu se raději vyhni, ne?
se z-indexem mám špatnou zkušenost, asi ho neumím správně používat, protože jsem se dostával do podobných situací jako ty :) nakonec jsem vždy vymyslel nějaký jiný řešení. nemuzeš jít třeba u toho cerveneho bloku do varianty ze by byl jako background? Každopádně jiný řešení jsem nikde nenašel.. |
||
Zahon Profil |
#5 · Zasláno: 10. 3. 2007, 15:51:49 · Upravil/a: Zahon
Napadlo mě řešení, ale není to zrovna elegantní... Spočívá v tom, že zelený div by měl position: relative; a v něm by byly dva divy s position: absolute; - jeden je ten červený s z-index: 1; a druhý je menší a zelený s z-index: 2; překrývající roh toho červeného divu, který nechceme aby byl vidět. Jak říkám, není to moc elegantní ale mělo by to fungovat..
EDIT: kdybych znal výšku a šířku zeleného bloku šlo by to i elegantněji se třemi divy. Ale to asi neznám, což? EDIT2: Pardon, tak jak mne Knopi upozornil níže, špatně jsem pochopil nákres... Takže takhle se to nevyřeší. |
||
Knopi Profil |
#6 · Zasláno: 10. 3. 2007, 15:52:14
xthomas:
to půjde ten text pres roh obrázku v červenem bloku? tomu se raději vyhni, ne? Ano, ta grafická opičárna co bude v červeném bloku, růžek bude zasahovat do zeleného bloku (proto to nemůže být nastaveno na background a musí to být pozicované "vyjmuté z dokumentu", nemůže ovlivňovat jiné bloky - není místo), přes ten roh možná povede text nadpisu, když bude dlouhý, nebo zvětšený. Chápej, že to musí být tvořeno takto, protože obrázek musí být v celku, poněvadž se bude na každé stránce měnit. Nemůžu ho rozstříhat. |
||
Knopi Profil |
#7 · Zasláno: 10. 3. 2007, 15:56:18
Zahon: Trošku jsem to zřejmě špatně nakreslil. ZELENÝ BLOK bude průhledný a ČERVENÝ BLOK bude tedy pod zeleným vidět.
|
||
Knopi Profil |
#8 · Zasláno: 10. 3. 2007, 19:07:30
Díky všem, už jsem to vyřešil, ale stejě by mne zajímalo jestli existuje nějaká cestička záporným z-indexem při absolutním pozicování. Každopádně mozzilka je z toho celá pryč. :)
|
||
Plaváček Profil |
#9 · Zasláno: 10. 3. 2007, 20:50:15
Knopi
Možná se pletu, ale mám takový pocit, že i na prvky s position:relative lze úspěšně naroubovat vlastnost z-index. Čili bloku zelenému dáš position:relative a z-index:2 a blok červený umístíš absolutně v kódu za zeleným s vlastností z-index:1 a mělo by to fungovat (netestoval jsem). |
||
Knopi Profil |
#10 · Zasláno: 10. 3. 2007, 23:06:23
Plaváček: Funguje. :o) To jsem z toho celej vedle. :o) Jen prvku s position:relative a z-index:2
se nesmí přiřadit float, potom ze záhadných důvodů zmizne v IE absolutně pozicovaný prvek - jen první postřeh z mého pohledu, ale to mi nevadí. Díky nadevše. |
||
Plaváček Profil |
#11 · Zasláno: 11. 3. 2007, 07:19:42
Knopi
potom ze záhadných důvodů zmizne v IE absolutně pozicovaný prvek To může mít souvislost s několika věcmi. Především plovoucímu prvku je dobré nastavit šířku (to asi máš), ale abys obešel Peekaboo, je dobré bloku nadřazenému nastavit pevnou šířku (nebo výšku, prostě nějaký rozměr), postačí třeba i pro IE width:100%. A zase by to mělo šlapat. |
||
Knopi Profil |
#12 · Zasláno: 11. 3. 2007, 09:47:41 · Upravil/a: Knopi
Plaváček: To může mít souvislost s několika věcmi. Především plovoucímu...
Na to jsem dával pozor. Zdá se, že tato krkolomná konstrukce je nad mé síly. CHYBY: - MSIE absolutně pozicovaný prvek se vůbec nezobrazí, když se uvede float u každého prvku. Mimo bloku (#obsah) - v něm se může floatit - OPERA 8.54 absolutně pozicovaný prvek se zobrazí, ale nad blokem s vyšším z-indexem tedy (#obsah) Jinak je to funkční! Ukázka je zde: Absolutně pozicovaný prvek - zmizí v MSIE Mám v záloze ještě jedno funkční řešení, takže kdybyste si také nevěděli rady, tak to přežiju. Jinak všem děkuji. |
||
Plaváček Profil |
#13 · Zasláno: 11. 3. 2007, 10:00:47
Knopi
Prostě matrjoška je zlato, říkám to pořád. Udělej to takto: Divy #obsah a #sloupec včetně clearu vraž do divu třeba s id="content" a tomu nastav šířku na width:100%. Šlape jak hodinky a jeden DIV navíc nikoho nezabije. Viz http://klient.plavacek.net/rosicky.html |
||
Knopi Profil |
#14 · Zasláno: 11. 3. 2007, 12:06:16
Teda Plaváčku, já čumim jak péro z gauče. Na to bych nepřišel ani za sto let. :) Ty si génius..., ještě jednou děkuju.
|
||
Časová prodleva: 17 let
|
Toto téma je uzamčeno. Odpověď nelze zaslat.
0