Autor Zpráva
Thommas
Profil *
#1 · Zasláno: 18. 5. 2007, 18:05:47
Odpovědět Citovat
Zdravim...mám problem s tím, že když mám menu jako seznam a v css takto nastylované, tak menu není uprostřed stránky, ale lehce k levýmu okraji a kvůli nenavazují obrázky na headeru a menu...dík, asi to bude nějaká začátečnická chyba, ale fakt si nevim rady.

menu {
background-image: url("obr/logo/menu.gif"); background-repeat: no-repeat; margin: auto; margin-bottom: 20px; margin-top: 0px; width: 600px; height: 49px; border: 0; text-align: center;}

menu a {
color: #666666; font-size: 12px; text-decoration: none; display: block; font-family: Impact; font-weight: normal; text-align: center;}

menu a:hover {
color: #ff0000; text-decoration: underline overline; border: 0px;}

menu a:active {
color: #ffff00}

menu li {
float: left; list-style: none; margin: auto; margin-left: 8px; margin-right: 8px; margin-top: 12px;}
Plaváček
Profil
#2 · Zasláno: 18. 5. 2007, 19:15:20
Odpovědět Citovat
Thommas

Z tohoto kódu nebude moudrý nikdo, pomohla by "živá" ukázka.
Thommas
Profil *
#3 · Zasláno: 18. 5. 2007, 20:01:48
Odpovědět Citovat
O.K. tak jsem to narychlo mrsknul na ic...ale berte to fakt jenom jako takovou "kostru"...ten header, co tam není ještě není uplně hotovej (chybí mi pár fotek), takže jsem ho tam ještě nedal, to na tu pozici vliv mít nebude...a texty ještě nejsou dopsaný, tak jsem tam mrsknul tohle.
Díky
Vladosik
Profil
#4 · Zasláno: 18. 5. 2007, 20:04:50
Odpovědět Citovat
Thommas
A odkaz?:-D
Thommas
Profil *
#5 · Zasláno: 18. 5. 2007, 20:14:41
Odpovědět Citovat
No vidíš to...já jsem si říkal, že jsem určitě na něco zapomněl :D
http://www.xma.kx.cz/index2_zkouska.htm
sgfsdr
Profil *
#6 · Zasláno: 18. 5. 2007, 20:50:54
Odpovědět Citovat
gsdfgd
Thommas
Profil *
#7 · Zasláno: 19. 5. 2007, 10:33:46
Odpovědět Citovat
Tohle mi fakt moc nepomohlo...
Prosím mrkněte na to někdo...nevěřim, že tu není nikdo, kdo by mi nedokázal poradit.
Vladosik
Profil
#8 · Zasláno: 19. 5. 2007, 11:18:36 · Upravil/a: Vladosik
Odpovědět Citovat
Thommas
Tak jsem koukal a nevim. Kazdopadne v IE6 ani v Opere Ti to nedela. Pouze ve Firefoxu, aspon v mem pripade...

Jinak u menu mas dvakrat text-align: center; a jeste jednou to mas u menu a, to je zbytecne, ale to je jedno, tim to neni.
Thommas
Profil *
#9 · Zasláno: 19. 5. 2007, 13:01:24
Odpovědět Citovat
Jj u mě taky v IE není posunutej obrázek (v Opeře to je taky o kousek posunutý, ale není to moc vidět, páč to tam nenavazuje na ten obrázek), ale stejně mi tam nesedí ten text. Už jsem z toho fakt zoufalej...
ladik
Profil
#10 · Zasláno: 19. 5. 2007, 15:18:44 · Upravil/a: ladik
Odpovědět Citovat
Thommas

Zkus třeba tohle:

nahraď v CSS: stylování celého menu:

div#menu {background: url("obr/logo/menu.gif") no-repeat; width: 600px; height: 49px; margin: 0 auto; text-align: center;}

menu {
margin: 0; padding: 0; width: 378px; border: 0; mar\gin: 0 auto;}

menu li {list-style-type: none; float: left;}

menu li a {
color: #666; font-size: 12px; text-decoration: none; float: left; font-family: Impact; font-weight: normal; text-align: center; margin-top: 12px; width: 54px;}

menu li a:hover {
color: #f00; text-decoration: underline overline;}

menu li a:active {
color: #ffff00}

------------------------------------------------
a ještě úprava, uzavření menu do DIVu kvůli vycentrování textu, v HTML: 

<div id="menu">

 <menu>

  <li>...</li>

 </menu>

</div>


Vyzkoušeno v IE 5.5 a 7, FF2 a Op9.20, Opera bere trochu odlišně "overline",
mar\gin: 0 auto; je tam kvůli starším IE, které nechápou margin: 0 auto;

- v CSS máš překlepy a chyby:

H1 font-height neexistuje, měl jsi na mysli určitě font-size
H2 display: bolck;, mmch, tagy <Hx> se chovají jako blokové elementy, není třeba jim to nastavovat.
H4 text-decoartion
#obsah margin:left: 0; asi by tam měla být pomlčka, a vůbec proč tolik marginů, stačí to zapsat jedním: margin: 0 auto;

- pokud ještě opravíš uzavření obrázku v <h2> v souladu s xhtml (chybí lomítko), bude kód html i css validní.
Thommas
Profil *
#11 · Zasláno: 19. 5. 2007, 15:47:01
Odpovědět Citovat
Díky moc!!! Ty chyby co jsi mi tu vypsal už jsem opravil a ještě jednou si to css projedu...pak to snad začnu zaplňovat textama atd.
Ještě jednou díky...je super, že jsi mi napsal i odůvodnění.
ladik
Profil
#12 · Zasláno: 19. 5. 2007, 17:00:02 · Upravil/a: ladik
Odpovědět Citovat
Thommas

Omlouvám se, vloudila se chybička, vypadlo zpětné lomítko v marginu, u oprav si to, jinak bude text menu ve starších IE posunut trochu doprava: 

menu {margin: 0; padding: 0; width: 378px; border: 0; mar\gin: 0 auto;}
Thommas
Profil *
#13 · Zasláno: 19. 5. 2007, 17:05:37
Odpovědět Citovat
Hele, proč je tam to margin 2x a proč je tam to lomítko? Nějaký IE bug?
ladik
Profil
#14 · Zasláno: 19. 5. 2007, 17:56:51
Odpovědět Citovat
Jo, tak nějak, starší verze IE neumí vycentrovat podle margin: 0 auto;, ale centrují podle text-align: center;, ale to zase v normálních prohlížečích funguje jen pro text. Situaci ještě komplikuje použití tagu menu, který má v IE a Opeře defaultně nastaven nějaký margin, ve FF je to však padding, vládne v tom pěkný zmatek.

Takže:
margin: 0; nuluje jeho hodnotu a v IE a Opeře je pak menu posunuto k levému okraji.

padding: 0; nuluje tento odstup menu ve FF.

Centrování v IE je provedeno nastavením text-align: center; v nadřazeném elementu, tady DIVu s id="menu"

mar\gin: 0 auto; centruje menu v normálních prohlížečích, když je takto napsán, se zpětným lomítkem, starší verze IE ho nevidí.
Thommas
Profil *
#15 · Zasláno: 19. 5. 2007, 18:34:04
Odpovědět Citovat
O.K. Dík...to mar/gin se mi upřímně řečeno moc nezamlouvá, tak to nechám na 


menu { padding: 0; width: 350px; border: 0; margin: 0 auto;}


To funguje v IE, FF i Opeře...kvůli starejm IE se mi to nechce prznit...snad chápeš.
Ale fakt si vážim, že jsi mi to takhle všechno poradil.
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0