Obrazok, ktory by pretrcal zvnutra wrapperu s pevnou sirkou

semo1212 · Napísal **semo1212**: 29.03.2011 19:23

Prosim poradte:
mam problem.... obrazok na stranke som si dal do wrapperu (960px sirka) a ukazalo mi ho dnu vo wrapperi a chcem aby z toho wrappera ten obrazok "vysiel".

vsetko presnejsie aj s kodom :
Obrazok, ktory by pretrcal zvnutra wrapperu s pevnou sirkou

Obrazok, ktory by pretrcal zvnutra wrapperu s pevnou sirkou

ako to urobit ??

Ďuri · Napísal **Ďuri**: 29.03.2011 19:38

Si mohol vymysliet tej teme aj normalnejsi nazov, premenovane...
Najjednoduchsie bude vlozit obrazok mimo wrappera, hm? Dalsie moznosti napriklad zaporny margin-left alebo absolutna pozicia.

johnny04501 · Napísal **johnny04501**: 29.03.2011 19:38

jeden sposob ako to spraviť:

Kód:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
   background-color: #666;
}

#content {
   width:960px;
   height:auto;
 background-color:#0F0;
 padding-top:250px;
 
}
#image {
   width:1200px;
   height:auto;
   margin-bottom:-250px;
   
   
}
</style>
</head>

<body>

<table width="1200px" align="center">
<tr><td align="center">

<div id="image"><img src="test.PNG" /></div>
<div id="content" align="center">
Kaskádové štýly alebo CSS (skratka z ang. Cascading Style Sheets) je všeobecné rozšírenie (X)HTML. Konzorcium W3C[1] označuje CSS ako jednoduchý mechanizmus na vizuálne formátovanie internetových dokumentov.
Štýly umožnili oddeliť štruktúru HTML alebo XHTML od vzhľadu.
Prvá verzia CSS (CSS level 1) vznikla už v roku 1996 a umožňovala prácu s písmami, okrajmi a farbami. V roku 1998 bola doplnená o nové možnosti a vznikol CSS level 2. V súčasnosti je podporovaná vo všetkých novších verziách prehliadačov (Internet Explorer, Opera, Mozilla, Netscape, Safari). Konzorcium W3 práve pracuje na špecifikácií CSS level 3.
Pomocou kaskádových štýlov sa vytvárajú štruktúrované dokumenty, teda oddeľuje sa obsah dokumentu (HTML) od jeho vzhľadu (CSS). Získa sa tým prehľadný a jednoduchý kód. CSS je možné presunúť do externých súborov, zmenší sa tým dátová veľkosť a dá sa jedným súborom zmeniť celý štýl stránky. CSS zaručuje rovnaké vykresľovanie vo všetkých prehliadačoch. Avšak nie vždy je jednoduché dosiahnuť optimalizovaný kód CSS pre celú škálu prehliadačov.



</div>

</td></tr>

</table>



</body>
</html>

semo1212 · Napísal autor témy **semo1212**: 29.03.2011 19:44

ok dakujem vám ale ak vlozim obrazok mimo wrappera a dam napr. margin-top: 200px; tak mi to urobi to, ze ten obrazok mi da nizsie a celu stranku mi posunie pod neho (asi som zabudol povedat ze aj nad tym obrazkom aj pod nim mam obsah ..... ale podla obrazku to tak asi vyzera

) skusal som aj dat z-index: 100; ale ani to nezabralo

johnny04501 · Napísal **johnny04501**: 29.03.2011 19:55

dak daj 3 div a hotovo a v druhom dive budes mat obrazok a v 3 dive zas obsah stranky a mas to vyriesene ale bo pouzi co ti odporucal Ďuri daj absolutnu poziciu

semo1212 · Napísal autor témy **semo1212**: 29.03.2011 20:02

ďakujam, ale ja chcem aby ten obrazok trochu zasahoval do pozadia headeru

... neviete co s tym ??

johnny04501 · Napísal **johnny04501**: 29.03.2011 20:13

ved jednoduche pre prvy a treti div das margin hodnotu - a mas

keby si nam tu dal nejaky nahlad na stranku o aky obrazok ide a ako mas rozlozenu stranku atd .. tak by bolo lahsie

// pridané po 8 minútach od posledného príspevku

SEMO1212 pridaj ma na skype : johnny-bazso
ja ti to spravim behom minutky ..

semo1212 · Napísal autor témy **semo1212**: 29.03.2011 20:21

ok tak davam screeny :

vysledok by mal byt takyto :
http://www.imghosting.cz/images/73vysledok.png

momentalne to je takto :
http://www.imghosting.cz/images/21stranka.png

kod stranky : http://jsfiddle.net/WuZgv/

shaggy · Napísal **shaggy**: 29.03.2011 20:24

Zaujímavé - mladý, kreatívny webdizajnér si nevie urobiť vlastný web?

semo1212 · Napísal autor témy **semo1212**: 29.03.2011 20:36

kto hovoril ze neviem robit stranky ?? ja mam len problem s tym obrazkom

walther · Napísal **walther**: 29.03.2011 20:47

len problém s tým obrázkom...
"vedieť robiť stránky" nie je len to, že si dáš dokopy nejaký kód, ale zahŕňa to v sebe aj schopnosť riešiť problémy, vyvíjať vlastné riešenia a jednať samostatne. nabifliť sa poučky, funkcie a elementy dokáže aj 10 ročné decko.

eh, ako pozerám, ty to tam máš dokonca aj uvedené že sa tomu venuješ od 10 rokov.. :lol:

normálne sa bojím spýtať, koľko máš teraz

ako nič v zlom, takáto "konkurencia" mi vôbec neprekáža. Len tak zo zaujímavosti: čo urobíš, ak ti grafik klienta dodá dizajn, ktorý nebudeš vedieť spracovať? Povieš mu, nech to prerobí? Pocupitáš opäť na fórum, nech to urobí niekto za teba?

semo1212 · Napísal autor témy **semo1212**: 29.03.2011 20:54

ok ... uz vsetci prestante ... mam 14 rokov a niesom v tom expert ako vy ... prisiel som tu aby ste mi poradili s mojim problemom a nie aby ste ma tu provokovali !!!

johnny04501 · Napísal **johnny04501**: 29.03.2011 20:55

problem vyriešný

Obrazok, ktory by pretrcal zvnutra wrapperu s pevnou sirkou

Podobné témy