| Autor | Zpráva | ||
|---|---|---|---|
| Someone Profil * |
#1 · Zasláno: 21. 8. 2011, 14:14:21
Dobrý den, mám menší problém. Mám obyčejný obrázek, řekněme o rozměrech 100x100 a umístím ho do prázdného dokumentu
<body> <img src="url-obrazku.png"> </body> tak mezi vrchní a levou hranou obrázku a hranou celého okna je asi 4 pixelový okraj. Snažil jsem se to řešit záporným marginem, ale nezdá se mi to zrovna správné. Nevíte jak se této mezery zbavit? |
||
| Michal Benda Profil |
#2 · Zasláno: 21. 8. 2011, 14:21:21
Zkusil bych ten nejjednodušší css reset:
<style>
* {
margin:0;
padding:0;
}
</style>
Je totiž možné, že element body má defaultně nějaký padding. Zkus to a napiš jsem, jak to dopadlo. |
||
| Someone Profil * |
#3 · Zasláno: 21. 8. 2011, 14:28:00
funguje to díky moc a jestli se můžu zeptat, co značí ta " * " díky
|
||
| Someone Profil * |
#4 · Zasláno: 21. 8. 2011, 14:37:50
A jestli můžu ještě jedne dotaz mám řadkové menu a asi nějak takhle
<div id="menu">
<img src="picture/menu/1.png">
<img src="picture/menu/2.png">
<img src="picture/menu/3.png">
<img src="picture/menu/4.png">
<img src="picture/menu/5.png">
<img src="picture/menu/6.png">
<img src="picture/menu/7.png">
</div>Ale mezi jednotlivými obrázky je mezera asi 3px široká, prosím nedá se taky nějak udělat, aby byli nalepené na sebe bez jakékoliv mezery? |
||
| margin Profil * |
#5 · Zasláno: 21. 8. 2011, 15:18:40
Someone:
„mám řadkové menu a asi nějak takhle“ Já bych to udělal asi nějak takhle: #menu a {float: left;} |
||
| Michal Benda Profil |
#6 · Zasláno: 21. 8. 2011, 16:39:33 · Upravil/a: Michal Benda
"*" značí všechny elementy, "body *" značí zase všechny elementy uvnitř elementu body.
Someone: „řadkové menu“ Menu by ale mělo být dělané pomocí tagů ul li. S tou mezerou bych to udělal obdobně jako s tím obrázkem. Jinak k tomu obrázku - nevím co na něm je, ale měl by jsi dobře zvážit zda se jedná o obrázek nebo o pozadí nějakého elementu (např. body). Pokud je to pozadí, tak použít CSS vlastnost background |
||
| Someone Profil * |
#7 · Zasláno: 21. 8. 2011, 17:28:03
Díky, float: left pomohlo ale vyskytl se to menší problém ,když použiju float: left tak se vlastnost kreou jsem dal body (text-align: center) se zruší jelikož se celý ten řádek posune do leva, ale já potřebuji aby byl uprostřed. Nevíte jak to udělat?
|
||
| Someone Profil * |
#8 · Zasláno: 21. 8. 2011, 17:44:27
Jestli dobře vím tak Float tomu menu nastaví Absolutní pozici což je to co nechci jelikož potřebuji aby to bylo zarovnané na střed.
|
||
| margin Profil * |
#9 · Zasláno: 21. 8. 2011, 18:08:55
Someone:
„Jestli dobře vím tak Float tomu menu nastaví Absolutní pozici“ Ne, když to řeknu zjednodušeně, tak float ti to naskládá jako bloky vedle sebe bez mezer. „potřebuji aby to bylo zarovnané na střed“ Víš, jak je každý obrázek široký, tak šířky sečteš a tuhle šířku a margin: auto; dáš obalovému elementu. Příklady: http://teststranek.kvalitne.cz/menu3/ 72+91+86+110+93+82+66=600 http://teststranek.kvalitne.cz/menu6/ 150+150+150+150=4×150=600 Element MENU, případně UL, nebo nějaký něšťastně zvolený DIV, bude v těchto příkladech široký 600px a bude mít, krom jiného margin: auto; menu { width: 600px; margin: auto; }Pokud používáš quirk režim, tak i pak jde vycentrování pro IE jednoduše zplácat. |
||
| Someone Profil * |
#10 · Zasláno: 21. 8. 2011, 18:43:10
Díky vaše rady mi moc pomohly.
|
||
| Petr ZZZ Profil |
#11 · Zasláno: 23. 8. 2011, 19:48:18
Someone:
„mezi jednotlivými obrázky je mezera asi 3px široká...“ Zalomení řádku kódu odpovídá bílému znaku – tedy mezeře. Podle toho, kde je kód zalomený, může se mezera v prohlížeči projevit nebo nemusí. Mezery mezi obrázky by měly zmizet, když kód zalomíš takto: <div id="menu"> <img src="picture/menu/1.png"><img src="picture/menu/2.png"><img src="picture/menu/3.png"><img src="picture/menu/4.png"><img src="picture/menu/5.png"> </div> (Je to jednoduché, ale tak trochu humpolácké řešení; spíš bych doporučil některý z marginových příkladů.) |
||
| margin Profil * |
#12 · Zasláno: 23. 8. 2011, 21:54:27
Petr ZZZ:
I tak to jde. Pak je ještě finta mezery zakomentovat. <div id="menu"> <img src="picture/menu/1.png"><!-- --><img src="picture/menu/2.png"><!-- --><img src="picture/menu/3.png"><!-- --><img src="picture/menu/4.png"><!-- --><img src="picture/menu/5.png"> </div> Praktické využití to má málokdy, ale je dobré o tom vědět, možná se to bude někdy hodit. |
||
| Petr ZZZ Profil |
#13 · Zasláno: 23. 8. 2011, 23:08:41
margin:
Safra, teď když vidím ty mezery v komentářích, mám mlhavý dojem, že už jsi mi to ve stejné souvislosti jednou psal. Snad už si to tentokrát zapamatuju! :) |
||
|
Časová prodleva: 13 let
|
|||
0