☰

» »

html/css - pravokotna tabbed navigacija

html/css - pravokotna tabbed navigacija

DarkSensei ::

Torej, rad bi v kodo spravil tole:
end result

end result



Problem je, ker neznam zadeve naredit tako da se borderji na li elementih nebi podvajal in da bi rdec pravokotnik za aktiven tab bil pravokoten (zdaj je nekako bolj podoben trapezoidu - zaradi stranskih borderjev).

Tole mi je do zdaj uspelo:
http://jsfiddle.net/k4nNn/1/

Hvala.

Pimoz :: 

.player-nav li {
  display: block;
  font-weight: bold;
  color: #999999;
  letter-spacing: 1px;
  border: 1px solid #eeeeee;
  border-right: none;
  padding: 10px;
  list-style: none;
  float: left;
}

.player-nav .active {
  -moz-box-shadow: inset #e74c3c 0 3px 0 0;
  -webkit-box-shadow: inset #e74c3c 0 3px 0 0;
  box-shadow: inset #e74c3c 0 3px 0 0;
}


There you go :)

DarkSensei ::

Super, hvala. Tole še poštima zadnji border-right: 
.player-nav li:last-child {
  border-right: 1px solid #eeeeee; 
}

Pimoz ::

U ja :) oprosti pozabil sem na to :)

DarkSensei ::

Se da kako spravit se tisto crto desno zraven? Zdaj sem naredil tako da aktivni tab nima spodnjega borderja, drugace bi lahko enostavno dal en div spodaj z borderjem.

Pimoz ::

Ne razumem te. Katera črta desno?

DarkSensei ::

Takole:



Torej ce je player-nav v nekem parent divu, da gre ta crta do konec tega diva.

Zgodovina sprememb…

neoserv ::

".player-nav" moraš nastavit na 100% in mu dodati border-bottom.
Verjetno ga bo treba potem še float-at zaradi layouta.
NEOSERV.SI = Prijazno & hitro SSD gostovanje že 15. leto.
900+ domenskih končnic po noro nizkih cenah!
Brezplačna selitev od starega ponudnika.

Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
!

Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )

Oddelek: Izdelava spletišč		1298344793 (3930) sunniegoldie
»

Prikaz strani na različni resoluciji-Joomla

Oddelek: Izdelava spletišč		151926 (1654) kr?en
»

Ocena? Kako bi dodal podstrani?

Oddelek: Pomoč in nasveti		6896 (761) shadeX
»

poravnava li elementov

Oddelek: Izdelava spletišč		82133 (1998) boss-tech
»

Wampserver in Firefox

Oddelek: Izdelava spletišč		61834 (1714) jonystar

Več podobnih tem