Autor Zpráva
aha
Profil
Zdravím, mám tento problém. Stránka s kódem (viz. níže) se mi zobrazí korektně v IE i ve FF a O.
Pokud však vyexportuji styly do zvl. stylesheetu *.css a připojím pomocí link, tak se mi přestanou zobrazovat obrázky na pozadí. URl je v pořádku, link taky (formátuje). Nevíte někdo co s tím?
Předem děkuji



<!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>
<title>template - navigace horizontální obrázková</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@import url(css/reset.css);
html {background-color:#151a2e;}
body{ padding:0 .5em;
margin:0;
text-align:center;
background-color:#151a2e;
}
#navi_hl{
background:#808080 url(navi-img/poz_hl_navi.jpg);
width:100%;
height:30px;
}
#navi_hl ul{
list-style:none;
margin:0;
padding:0;
width:650px;
min-width:800px;
}
#navi_hl ul li{
line-height:30px;
margin:0;
padding:0;
float:left;

}
#navi_hl a span{
visibility:hidden;
}
#navi_hl a {
display:block;
margin:0;
padding:0;
width:108px;
text-decoration:none;
}

#navi_hl a:link {
background:#808080 url(navi-img/navi_f.jpg) -1px 0 no-repeat;
background-image: url(navi-img/navi_f.jpg);
}
#navi_hl a:visited {
background:#808080 url(navi-img/navi_f.jpg) -1px -60px no-repeat;
}
#navi_hl a:hover{
background:#808080 url(navi-img/navi_f.jpg) -1px -90px no-repeat;
}
#navi_hl a:active{
background:#808080 url(navi-img/navi_f.jpg) -1px -90px no-repeat;
}
body.onas #navi_hl a.onas,
body.penzion #navi_hl a.penzion,
body.oddech #navi_hl a.oddech,
body.jidlo #navi_hl a.jidlo,
body.obj #navi_hl a.obj,
body.dotaz #navi_hl a.dotaz{
background:#fff url(navi-img/navi_f.jpg) -1px -30px no-repeat;
}
#navi_cont {
margin:0 auto;
padding:0;
width:650px;
}
hr.cleaner {
margin: -1px 0 0 0;
padding:0;
border:none;
height:1px;
visibility:hidden;
clear:left;
}
img#navi_left{
float: left;
border:none;
width:20px;
margin:0;
padding:0;
}
img#navi_right{
float: right;
border:none;
width:20px;
margin:0;
padding:0;
}
</style>

</head>
<body class="onas">
<div id="navi_hl">
<img id="navi_left" src="navi-img/left_hl_navi.jpg" />
<img id="navi_right" src="navi-img/right_hl_navi.jpg" />
<div id="navi_cont">
<ul>
<li><a class="onas" href="#"><span>O nás</span></a></li>
<li><a class="penzion" href="#"><span>O penzionu</span></a></li>
<li><a class="oddech" href="#"><span>O oddechu</span></a></li>
<li><a class="jidlo" href="#"><span>O jídle</span></a></li>
<li><a class="obj" href="#"><span>O bjednat</span></a></li>
<li><a class="dotaz" href="#"><span>O tázky</span></a></li>
</ul>
</div>
</div>
</body>


</html>
Joker
Profil
aha
se mi přestanou zobrazovat obrázky na pozadí
...protože ten CSS soubor je v jiném adresáři a tudíž relativní cesta k obrázkům je jiná.
Str4wberry
Profil
URL právě v pořádku nebude. V jaké složce je umístěn vyexportovaný CSS soubor?
aha
Profil
strom je asi takto:

složka css obsahuje soubor - navi.css
- reset.css

složka navi-img obsahuje obrázky - navi_f.jpg
- poz_hl_navi.jpg
- left_hl_navi.jpg
- right_hl_navi.jpg
index.htm


styly ve stránce (index.htm) volám takto:

<link href="css/navi.css" rel="stylesheet" type="text/css" />
Str4wberry
Profil
Aha:
složka css obsahuje soubor - navi.css
Což znamená, že se odkazuješ na obrázky na adrese „css/navi-img/poz_hl_navi.jpg“, viz Joker.

Můžeš:
1. Přesunout „navi.css“ k „index.htm“,
2. složku „navi-img“ dát do složky „css“,
3. přepsat všechny adresy na „../navi-img/poz_hl_navi.jpg“ apod.
aha
Profil
Str4wberry:
Díky,
použil jsem to za 3. Udělal jsem to sice již před tím, ale pomocí Ctrl+F a Replace All. Někde se tam vloudila chybka, protože to nefungovalo. Teď už jo, tak ještě jednou dík.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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