Autor Zpráva
Byss
Profil *
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
list-style-image má být v .header ul li. Nikoli v .header ul
Byss
Profil *
Jozin:
Ďakujem, ale nič sa nezmenilo. Vo FF aj Opere to ide ako vtedy, a ie s chrome nejdú :-(
Jozin
Profil
používáš .header ul li, nebo furt jen .header li?
Byss
Profil *
.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
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 *
Jozin:
áno, to viem, že je to párový tag, ale tam chyba nieje :-/.
Jozin
Profil
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 *
Jozin:
Na locale mám, ale aj tak to hodím na web, nech sa na to pozrieš je to uploadnuté.
Jozin
Profil
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 *
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
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 *
Jozin:
Nad display inline som rozmýšlal už na začiatku, v tom prípade sa šípky neukážu nikde.... nechápem.
margin
Profil *
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 *
margin: +1 ide to v každom prehliadači, ďakujem za rady obom :-)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0