Vse, kar ste si želeli vprašati o CSS, pa si niste upali.

Racer D:

Očitno sem se premalo natančno izrazil. Tako kot si ti naredil je uspelo tudi meni (vseeno hvala). Zanima me pa, če sedaj, ko imaš sliko fizično ( < img src="..."> ) že nekam postavljeno (na neko mesto v tem DL), lahko premakneš za npr. 50px višje, vendar brez fizičnega premikanja image tag-a v html dokumentu?

Torej samo z uporabo CSS-ja. In da sliko oblije besedilo, ne da ostane tistih 50px pod sliko praznih.

Obstaja kaka alternativa za border-bottom: 1px solid #C8C8C8;, ker IE mi ga sploh ne prikaže , medtem ko v FF in Operi dela BP

Celotna koda je W3C XHTML 1.0... bom pastu sam (drugače je preveč kode) footer.tpl in del CSS-ja ki se navezuje:

{* Smarty *}
 <tr>
  <td colspan="4" id="noga" align="center">
   Stran je bila zgenerirana v {$TIME} s,
   {if $N_QUERY == 1}
    izvrÜena je bila {$N_QUERY} zahteva.
   {elseif $N_QUERY == 2}
    izvrÜeni sta bili {$N_QUERY} zahtevi.
   {elseif $N_QUERY == 3 || $N_QUERY == 4}
    izvrÜene so bile {$N_QUERY} zahteve.
   {else}
    izvrÜenih je bilo {$N_QUERY} zahtev.
   {/if}
  </td>
 </tr>
 <tr>
  <td id="n_spodaj_levo"></td>
  <td colspan="2" id="n_spodaj"></td>
  <td id="n_spodaj_desno"></td>
 </tr>
</table>
</body>
</html>

style.css:

#noga {
	border-left: 1px solid #C8C8C8;
	background-color: #E8E8E8;
	border-right: 1px solid #C8C8C8;
}

#n_spodaj_levo {
	background-image: url("images/t_spodaj_levo.gif");
	background-repeat: no-repeat;
	width: 6px;
	height: 6px;
}

#n_spodaj {
	background-color: #E8E8E8;
	border-bottom: 1px solid #C8C8C8;
}

#n_spodaj_desno {
	background-image: url("images/t_spodaj_desno.gif");
	background-repeat: no-repeat;
	width: 6px;
	height: 6px;
}

Problematičen border je pri id-ju #n_spodaj

Ne smem... ker je celica visoka komaj 6px, kar določim v #n_spodaj_levo, če dopišem &nbsp; mi sicer prikaže tist rob ampak poleg tega še poviša celico... tako da skazi celotno stvar še 10x bolj , potem še v FF ne dela prav ...

nisem 100% da to dela za tabele ampak poizkusi tudi z overflow:hidden;

pa se, ce ti kaj pomaga, CSS - Fun with tables

font-size kamot daš manjšega, recimo font-size: 0;.

Če si rešil, potem ni panike, drugače pa v taki primerih, ki ti pijejo živce, zadevo lahko rešiš tudi takole

1. izdelaj en 1x1px image pobarvan v #C8C8C8 (npr. graypix.png);
2. id definiraj takole
#n_spodaj {
background: #E8E8E8 url(graypix.png) repeat-x left bottom;
}
3. probat ni greh...

Rezultat je skoraj enak (manjši je za debelino borderja - borderje IE in Gecko obravnavata drugače - IE jih riše po zunanji strani celice, Gecko pa po robu - centru).

Mi je tale tvoja ideja tudi šinila mimo uči, ko sem delal, ampak sem raje brez tega naredil...

Vsaki celici v tem stolpcu posebej. Žal :/

Prime, prime!

Pokaž kodo.

uporabi {st.koda html} {/st.koda html} in zamenjaj {} z []

Imaš več možnosti - ena je dodajanje div-ov (poguglaj za css vertical align), druga (če se ti izide) pa je manevriranje z line height.

Že večkrat premleto: vertical-align ima drugo funkcijo.

Rešitev

Jaz sem napravil tak meni tako, da sem iz URLja bral lokacijo DOCUMENT_URI in nato primerjal string v if stavku s to lokacijo.
Če se je lokacija ujemala sem določil class1, če pa se ni sem pa določil class2.
Tudi tisti > je napravljen na enak način. Pač daš da se ob določenem idju pokaže dodaten div oz dodatna tabela, ki vsebuje znak >. Potrebno je malo načrtovanja, ampak se da hitro narediti.

• Useful CSS tips:Color and Background - MDC
• Avoid inheritance of the CSS Opacity across borswers

V html s atributom height bi to napravil tako:

<td height="2"></td>

V CSS pa uporabiš:

td {
	height: 2px;
	}

ali pa določiš vsakemu tdju poseben class

.dvapxtd {
	height: 2px;
	}

<td class="dvapxtd"></td>

Če prav razumem bi pa v drugem primeru rad za spodnjo obrobo nastavil sliko? Prvič vidim kaj takšnega. Jaz bi se zadeve vsekakor lotil na drugačen način, ampak mogoče pa kdo drug ve...

Bi rabil malo vaše pomoči:

V CSS fajlu imam kodo za meni (horizontalni):

 
.menu  {
	font: bold 16px arial;
	font-variant:small-caps;
	margin:0;
	padding:6px 0;
	text-align:center;
	border:dashed solid 1px;
	border-style:dashed;
	}

+ še dodatne li, a, hover itd.

V HTMLju imam tako kodo pri meniju:

<div id = " kontejner ">
<ul class="menu">
<li><a href="link1.html" target="_self">link1</a></li>
<li><a href="link2.html" target="_self">link2</a></li>
<li><a href="link3.html" target="_self">link3</a></li>
<li><a href="link4" target="_self">link4</a></li>
</ul>

Kot vidie vse skupaj v divu kontejner.
CSS koda za kontejner:

#kontejner {
text-align:center; 
margin:0 33%;
width:435px;
}

In kako bi jst zdej lahko spravu ta meni (dolžina 435px), da bi bil vedno na sredini, glede na širino okna ?

S tvojo kodo mi ga postavi takole:

<div id = " kontejner ">

poskusi brez presledkov pri " kontejner ", torej id="kontejner"

Evo LINK do strani.

Rad bi tisti gornji meni mel vedno na sredini, glede na širino okna.

Za CSS kliknite link do CSSja (na strani).

Hvala vnaprej.

Seveda obstaja.

Je pa namesto

    border-style:solid;
    border-top-color:white;
    border-bottom-color:white;
    border-left-color:white;
    border-right-color:white;
    border-width:4px;

vsekakor krajse

border: 4px solid white;

Drugace pa, kot pravi CaqKa samo odstrani tisti float: left, ce ga nimas tam iz kakega drugega razloga.

Mene pa zanima kako postaviš layer na sredino strani. Poskusil sem tako, da sem določil body {text-align:center;} in v IE (z vključenim Doctype-om) dela, v mozilli pa ne.

Sem spregledal. Najlepša hvala!

standardno se ne da. videl sem ze precej, precej grde hacke za to zadevo (da je imel gumb visibility:hidden in si videl ozadje za njim, kliknil pa nanj) ampak bi ti priporocal da se jih izogibas, ker se podrejo ob vsakem cisto malo bolj eksoticnem brskalniku (ali pa celo OS-u)