Autor | Zpráva | ||
---|---|---|---|
Byss Profil * |
#1 · Zasláno: 26. 6. 2011, 11:14:20
Zdravím všetkých,
Mám problém s menu, ktoré tvorím pomocou CSS. Konkrétne mám šípku, ktorú chcem mať pred každou časťou zoznamu. Kód - .header { height:79.5px; width:775px; border-top:1px solid #858585; background-color:343434; margin:0 auto;} .header ul {list-style-image:url(images/arrow.gif); margin-left:325px; } .header li { margin-left:50px;margin-top:15px; float:left; color:white;} a v index - <!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"> <link rel="stylesheet" href="css.css" type="text/css"> <title></title> </head> <body> <div class="header"> <ul> <li> Home 1 <li> Home 2 </ul> </div> </body> </html> Akonáhle dám .header li - float:left; tak mi tie šípky v IE a Chrome miznú. Link na živú ukážku - Odkaz Ďakujem vopred za rady! |
||
Jozin Profil |
#2 · Zasláno: 26. 6. 2011, 11:17:16
list-style-image má být v .header ul li. Nikoli v .header ul
|
||
Byss Profil * |
#3 · Zasláno: 26. 6. 2011, 11:19:41
Jozin:
Ďakujem, ale nič sa nezmenilo. Vo FF aj Opere to ide ako vtedy, a ie s chrome nejdú :-( |
||
Jozin Profil |
#4 · Zasláno: 26. 6. 2011, 11:25:12
používáš .header ul li, nebo furt jen .header li?
|
||
Byss Profil * |
#5 · Zasláno: 26. 6. 2011, 11:27:23
.header ul { margin-left:325px;} .header ul li { margin-left:50px;margin-top:15px; float:left; color:white;list-style-image:url(images/arrow.gif);} Aby sme sa chápali mám to nejako takto. |
||
Jozin Profil |
#6 · Zasláno: 26. 6. 2011, 11:30:24
V HTML máš chybu li je párový tag. Možná je to i tím, ale nevím to jistě. Chrom ani IE nevedu.
|
||
Byss Profil * |
#7 · Zasláno: 26. 6. 2011, 11:31:58
Jozin:
áno, to viem, že je to párový tag, ale tam chyba nieje :-/. |
||
Jozin Profil |
#8 · Zasláno: 26. 6. 2011, 11:34:36
nemáš ukončené li... zkus je ukončit a pak to vyzkoušet. A uploadni to na web, abych se na to mohl mrknout, když je to opravené
|
||
Byss Profil * |
#9 · Zasláno: 26. 6. 2011, 11:41:29
Jozin:
Na locale mám, ale aj tak to hodím na web, nech sa na to pozrieš je to uploadnuté. |
||
Jozin Profil |
#10 · Zasláno: 26. 6. 2011, 11:47:44
místo float: left použij display: inline a prosímtě když je to css soubor, tak to za ; odřádkuj ať je to přehlednější. background-color máš bez #. Zkus toto všechno opravit, co to udělá potom.
Jen vařím z vody, protože opravdu netuším, proč to v IE a Chrome nejede. |
||
Byss Profil * |
#11 · Zasláno: 26. 6. 2011, 11:54:21
Jozin:
Nepomohlo, žiadna zmena len pri display:inline; sa všetko rozhádzalo. Netuším ani ja, prečo to nejde. Problém je ten, že pri float: sa šípky nezobrazia (IE,CHROME). |
||
Jozin Profil |
#12 · Zasláno: 26. 6. 2011, 11:55:39
takže když odděláš float, tak se zobrazí šipky? Tak ho oddělej nahraď display inline a snaž se to nastylovat s display inline.
|
||
Byss Profil * |
#13 · Zasláno: 26. 6. 2011, 12:00:41
Jozin:
Nad display inline som rozmýšlal už na začiatku, v tom prípade sa šípky neukážu nikde.... nechápem. |
||
margin Profil * |
#14 · Zasláno: 26. 6. 2011, 12:17:22
Jozin:
„list-style-image má být v .header ul li. Nikoli v .header ul“ V tomto případě jedno, jestli se deklarují odrážky seznamu nebo položce. „V HTML máš chybu li je párový tag.“ Není, koncová značka je nepovinná. Byss Tipnul bych si, že není místo pro zobrazení odrážky, nastav položkám vhodná levý margin a padding. Ještě lépe, nepoužívej list-style image, ale background: http://teststranek.kvalitne.cz/odrazky1/ „Nad display inline som rozmýšlal už na začiatku, v tom prípade sa šípky neukážu nikde.... nechápem.“ Odrážky list-style-image můžeš dát jen elementům, které mají display: list-item; což inline jaksi není. Ale opět můžeš použít background, jsou s tím dělat "psí kusy" http://teststranek.kvalitne.cz/menu-odrazkove-1/ http://teststranek.kvalitne.cz/menu7.3/ - z HTML kódu si moc příklad neber, jsou to odkazy naházené do odstavce |
||
Byss Profil * |
#15 · Zasláno: 26. 6. 2011, 12:30:48
margin: +1 ide to v každom prehliadači, ďakujem za rady obom :-)
|
||
Časová prodleva: 13 let
|
0