| Autor | Zpráva | ||
|---|---|---|---|
| Seb_ Profil * |
#1 · Zasláno: 12. 1. 2008, 14:22:48
Ahoj,
chtěl bych Vás požádat o pomoc... Chci udělat aby web vypadal cca takto: 
Zkoušel jsem to dělat v css, ale narazil jsem na tyto problemy: - Patika nedorazi uplne k okrajum ok na IE - Kdyz chci umistit hlavni na pozici 20% z prava a 75px odspodu, hodi to hlavni nekam uplne jinam - - muzete poradit jak seznam napozicuju vodorovne, taky aby z nej mohlo byt menu? Nebo to mam delat klasicky: <div class="polozkamenu"> Menu1 </div><div class="polozkamenu"> Menu2 </div><div class="polozkamenu"> Menu3 </div> ?? Web mam v NB, takze jeste doplnim presny zapis css. S pozdravem a předem děkuji za radu nebo i za vas cas. Seb |
||
| Manq Profil |
#2 · Zasláno: 12. 1. 2008, 14:26:40
K tomuhle nemusíš využívat žádné position. Stačí float.
|
||
| Seb_ Profil * |
#3 · Zasláno: 12. 1. 2008, 14:37:42
K tomuhle nemusíš využívat žádné position. Stačí float.
float? Promin, ale nechapu jak vyuziju obtekani? |
||
| Manq Profil |
#4 · Zasláno: 12. 1. 2008, 14:43:01
|
||
| Seb_ Profil * |
#5 · Zasláno: 12. 1. 2008, 14:52:44
tak uz jsem pochopil, jak vyuziju obtekani, ale taky je mi jasne, ze ne vsechny prvky budou mit nastaveno float, muzes/muzete mi prosim poradit, ktere prvky by meli byt s hodnotou float a ktere nechat jak jsou ?
|
||
| Manq Profil |
#6 · Zasláno: 12. 1. 2008, 15:08:29
Tak .hlavni a .patika mít nebudou. Zkoušej to.
<div class="polozkamenu"> Menu1 </div><div class="polozkamenu"> Menu2 </div><div class="polozkamenu"> Menu3 </div> ?? Takhle určitě ne, nýbrž takhle ul li {float:left;} |
||
| Joker Profil |
#7 · Zasláno: 12. 1. 2008, 15:09:43 · Upravil/a: Joker
Jak bych asi postupoval já (jen analýza a netvrdím, že je to správně :) )
- Flash bude mít float: left. - Hlavní kontejner a menu možná budou potřebovat matrjošku (aneb "nedáš-li tam matrjošku, nabije si JESPR držku" :) ) - Celá stránka bez patičky bude v jednom kontejneru, který se přes margin napozicuje tak, jak to je na obrázku. - Patička bude zvlášť. - Pokud má patička být na spodním okraji okna i když stránka je kratší, tak bude celá stránka včetně patičky potřebovat ještě jeden kontejner (aneb vychytávka s kontejnerem s position:relative a min-height: 100% a patička pozicovaná na jeho spodek... k vidění třeba na mém webu, je to popsané i někde tady na fóru). edit: - jo a menu, tlačítka vedle sebe... buď prostě display: inline, nebo přes float |
||
| xlx21 Profil |
#8 · Zasláno: 12. 1. 2008, 17:44:58
Zkoušel jsem to dělat v css, ale narazil jsem na tyto problemy:
- Patika nedorazi uplne k okrajum ok na IE - Kdyz chci umistit hlavni na pozici 20% z prava a 75px odspodu, hodi to hlavni nekam uplne jinam - - muzete poradit jak seznam napozicuju vodorovne, taky aby z nej mohlo byt menu? Tak 1, na to abi to vsetko dorailo tak ako ma sa pouziva margin="0px"; cim definujes pre vsetky strany 0; 2.zoznam sa pozicuje vodorovne s selektorom float="left" a odstranic pocitanie display="inline" v IE 3. Ak chces spravim ti to a poslem. |
||
| xlx21 Profil |
#9 · Zasláno: 12. 1. 2008, 18:45:07
Ahoj,
chtěl bych Vás požádat o pomoc... Chci udělat aby web vypadal cca takto: Tak stacilo trosku pismenkovania kodu a mame vysledok. Ukazka: 
Zdrojak: <!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 {
}
#flash {
position:absolute;
top:30px;
left:95px;
width:200px;
height:400px;
border:1px solid #000000;
}
#content {
position:absolute;
top:30px;
left:296px;
width:599px;
height:400px;
border:1px solid #000000;
}
#foot {
position:absolute;
top:431px;
left:95px;
width:800px;
height:150px;
border:1px solid #000000;
}
.menu {
position:absolute;
left:-1px;
width:599px;
height:30px;
border:1px solid #000000;
top: -1px;
}
.menu ul {
position:absolute;
margin-top:0px;
width:250px;
left:310px;
height:30px;
}
.menu ul li {
margin-top:0;
display:inline;
display:block;
float:left;
padding:5px 20px 0px 20px;
}
.menu ul li a {
text-decoration:none;
}
</style>
</head>
<body>
<div id="flash">
</div>
<div id="content">
<div class="menu">
<ul>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
</ul>
</div>
</div>
<div id="foot">
</div>
</body>
</html>
|
||
| habendorf Profil |
#10 · Zasláno: 12. 1. 2008, 18:58:48
xlx21
Tak tohle je extrémní prasečina. |
||
| xlx21 Profil |
#11 · Zasláno: 12. 1. 2008, 19:22:50
Tak tohle je extrémní prasečina.
tohle je to co chcel. |
||
| Měsíček Profil |
#12 · Zasláno: 12. 1. 2008, 19:30:50
xlx21
někdy i taková věta pomůže. |
||
| xlx21 Profil |
#13 · Zasláno: 12. 1. 2008, 19:33:20
někdy i taková věta pomůže.
Tak skus ti psat to co mas a nie jenom tak cmarat jo? |
||
| Měsíček Profil |
#14 · Zasláno: 12. 1. 2008, 19:34:38
promiň, ale tuhle větu jsem nepochopil :)
|
||
| xlx21 Profil |
#15 · Zasláno: 12. 1. 2008, 19:42:54
promiň, ale tuhle větu jsem nepochopil :)
chcel poradit a ja som mu poradil |
||
| Měsíček Profil |
#16 · Zasláno: 12. 1. 2008, 19:44:02
Aha tak to se omlouvám já tam pořád viděl jako kdyby otazník :-))) a ono to bylo konstatování tak to ještě jednou promiň :)
|
||
| habendorf Profil |
#17 · Zasláno: 12. 1. 2008, 20:23:10
tohle je to co chcel.
Fakt? Myslíš že chtěl, aby mu text vytékal ven z boxů, například? Inu možné to je, pravděpodobné nikoliv. |
||
| Manq Profil |
#18 · Zasláno: 12. 1. 2008, 21:00:13
chcel poradit a ja som mu poradil
To sice ano. Ale každá rada je lepší (dokonce i žádná), než ta tvá. |
||
| Seb_ Profil * |
#19 · Zasláno: 13. 1. 2008, 02:46:50
Tak tady je moje pracicka, nektere veci jsem prevzal z kodu od xlx21, za což mu děkuju.
(Ty převzane nemaji mezi vlastnosti a hodnotou mezeru, pisu s mezerama ;) ) Prosim o zhodnoceni zapisu, popř., pokud tam je nejaka nelogicnost, zbytecnost, bo podobně, tak me na ni upozornete. Testoval jsem to pod FF 2.0.0.11, tam to jede dobre, ale pod IE 7.0 to dela problemy, bohuzel nedokazu posoudit, ktery zapis ... :( <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="generator" content="PSPad editor, www.pspad.com">; <title> Wanted czweb (project Alise) </title> </head> <body> <style type="text/css"> .hlavni { border-width: 1px; border-color: black; border-style: solid; width: 500px; height: 600px; position: absolute; right: 15%; bottom: 95px; } .flash { border-width: 1px; border-color: flash; border-style: solid; width: 400px; height: 600px; position: absolute; float: left; top: -1px; left: -402px; margin: 0px; padding: 0px; } .menu { background-image: url(''); background-repeat: repeat; background-color: red; position:absolute; left:-1px; width:500px; height:30px; border:1px solid #000000; top: -1px; } .menu ul { position:absolute; width:100%; height:30px; left:0px; margin-top:0px; } .menu ul li { margin-top:0py; display:inline; display:block; float:left; padding:5px 20px 0px 20px; } .menu ul li a { text-decoration:none; } .paticka { width: 100%; height: 95px; border-width: 1px; border-color: black; border-style: none; background-image: url('pozadi.jpg'); background-repeat: repeat; background-color: black; margin: 0px; position: absolute; right: 0px; bottom: 0px; } .prejdi { border-width: 1px; border-color: #323234; border-style: solid; background-color: #F0F1E9; padding: 1px; width: 120px; font-family: Arial CE; font-variant: small-caps; font-size: 8pt; text-align: right; color: #A7A4A1; } .btnprejdi { border-width: 1px; border-color: #323234; border-style: solid; background-color: #484649; margin: 0px; padding: 1px; width: 20px; font-family: Arial CE; text-align: center; color: #A7A4A1; } </style> <div class="hlavni"> <div class="flash"> </div> <div class="menu"> <form> <input type="text" name="hledej"> <input type="submit" value="Go"> </form> <div class="menu"> <ul> <li> Menu1 </li> <li> Menu2 </li> <li> Menu3 </li> </ul> </div> <div id="submenu"> </div> </div> Text. </div> <div class="paticka"> <form> <input type="text" name="prejdi" value="seznam.cz" class="prejdi" onClick="if (this.value!='') this.value='';"> <input type="submit" value=">>" class="btnprejdi"> </form> </div> </body> </html> |
||
| Seb_ Profil * |
#20 · Zasláno: 13. 1. 2008, 02:49:43
A ještě bych měl asi doplnit jake chyby jsou na strance:
(pod IE) - menu neni zarovnane doleva - jeden cerveny prozek pod menu navic - mezera (2px) mezi .flash a .hlavni a ve FF - menu neni zarovnane doleva |
||
| xlx21 Profil |
#21 · Zasláno: 13. 1. 2008, 07:10:13
A ještě bych měl asi doplnit jake chyby jsou na strance:
(pod IE) - menu neni zarovnane doleva - jeden cerveny prozek pod menu navic - mezera (2px) mezi .flash a .hlavni a ve FF - menu neni zarovnane doleva chce to pouzit margin s nulovou hodnotou a doladit. ... posli screenshot ako mam ja nech vidim co sa tam deje aj v IE aj vo FF. Zatim sa maj. |
||
| Seb_ Profil * |
Ve FF (relativne dobre, ale menu neni zarovnane doleva...)
http://img245.imageshack.us/img245/5397/web1uq0.jpg V IE7 (skoro vse blbe...) http://img151.imageshack.us/img151/4779/web2ae3.jpg |
||
| xlx21 Profil |
#23 · Zasláno: 13. 1. 2008, 12:16:39
Ve FF (relativne dobre, ale menu neni zarovnane doleva...)
Mujscreenshot si videl co chces tam jeste zmenit. P.S. Skontroluj verzi IE FF ve IE 6 nefunguje spousta veci. |
||
| Seb_ Profil * |
#24 · Zasláno: 13. 1. 2008, 13:10:13
xlx21: chce to pouzit margin s nulovou hodnotou a doladit. ...
vůbec nechpu, k čemu to bylo... popiš na co jsi to myslel... Mujscreenshot si videl co chces tam jeste zmenit. opět nechapu, co tim chces rict... :/ P.S. Skontroluj verzi IE FF ve IE 6 nefunguje spousta veci. je nepsal nic o IE6, popravde ani ji nemam v pc.... btw: chtel jsem vedet, co zpusovuje to spatne chovani... |
||
| Manq Profil |
#25 · Zasláno: 13. 1. 2008, 13:16:03 · Upravil/a: Manq
Ve FF (relativne dobre, ale menu neni zarovnane doleva...)
http://img245.imageshack.us/img245/5397/web1uq0.jpg V IE7 (skoro vse blbe...) ]http://img151.imageshack.us/img151/4779/web2ae3.jpg[/i] Z obrázků nelze jednoduše a přesně poznat, co je příčinou tvých problémů. Kód uvedený výše je ten problémový? Když jsem ho zkusil v FF, tak se mi objevily pouze dva sloupce a patička. Menu nikde. Proto nás odkaž na tvou stránku, ať můžem s jistotou říci, co způsobuje tvé problémy. |
||
| Manq Profil |
#26 · Zasláno: 13. 1. 2008, 13:17:29
btw: chtel jsem vedet, co zpusovuje to spatne chovani...
Tipoval bych to na absolutní pozicování. Zkus to pomocí float. |
||
| Seb_ Profil * |
#27 · Zasláno: 13. 1. 2008, 20:51:18
Na stránku se dostanete po kliknutí
Ale funguje relativne dobre jen pod FF 2.0.0.11 (nejspis jde o problem s divem, proto ma .menu nastaveno top: -16px; a to vyvolava zase problem u IE, kde je menu jen pulkou, ak kkde ma byt...) Musim jeste hodne studovat.... :( |
||
| xlx21 Profil |
#28 · Zasláno: 14. 1. 2008, 20:07:33
Na stránku se dostanete po kliknutí
Ale funguje relativne dobre jen pod FF 2.0.0.11 (nejspis jde o problem s divem, proto ma .menu nastaveno top: -16px; a to vyvolava zase problem u IE, kde je menu jen pulkou, ak kkde ma byt...) Musim jeste hodne studovat.... :( Tento moj kod vid vyse ti musi fungovat presne podla mojho obr ed mas tam aj screenshot. A musis nekde mat xybicku ty, alebo posli link kde mas tu stranku upnutu a kukneme sa na to. |
||
| Seb_ Profil * |
#29 · Zasláno: 16. 1. 2008, 20:38:47
xlx21:
Zdravičko, neříkám, že ne nefunguje, to určitě ne, ale tahle stranka je vec na ktere bych se chtel podilet sam, neni to kvuli penezum nebo tak, jen proste se to chci naucit a vedet jak to mam delat.... Mozna jen jedna vec na tom tvem zapisu, ktera se mi moc nelibi: vsechny prvky rovnas od leveho horniho rohu, takze je to moc "nacpane" nalevo, tento web chci spis na stred. (ale ostatne ani ten muj zapis se tomu neblizi....:( ) A ten link je v minulem prispevku, staci jen kliknout na "... po kliknutí". Tak pokud by jsi vedel, kde delam chybu |
||
|
Časová prodleva: 16 let
|
|||
0