» »

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

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

««
17 / 26
»»

R33D3M33R ::

Uh, tole je pa dobro vedeti. Res je le ena vrstica.
Moja domača stran: http://andrej.mernik.eu
Na spletu že od junija 2002 ;)
:(){ :|:& };:

kopriwa ::

Eno vprašanje za stručkote. Ker IE ne prepozna hover drugje kot na a tagu, sem dodal a href na neko slikco. Zdej bi pa rad da bi se ta slikca spremenila ko greš z kurzorjem čez to slikco. V mozilli rata brez problema ampak tm mam naštiman drugače, oz samo da se background image spremeni. No upam da ste me razumel, če pa ne, bom pa pastal tisto skropucalo od kode sm ;). Oz. rabm samo idejo za izpeljavo, ker ne znam zamenat slike če greš z kurzorjem čez prvotno sliko.
edit: sem že pogruntal, sem dodal a href na div element, pr hover se mu pač zamenja background image.

Zgodovina sprememb…

  • spremenilo: kopriwa ()

arjan_t ::

kako narediti raztegljiv div s custom robovi, robovi so slike. Ni mi problem arediti raztegljivega v desno, problem je po višini (če je višina določena ni problem). Upam da je dovolj razumljivo :)

Iščem po googlu pa ne vem kot kaj naj sploh iščem :S

Binji ::

poglej malo za clanki kako ustvariti zaobljene robove s CSS-om. Stvar v bistvu vkljucuje 8 divov - za vsak rob in vsako stranico, vsak s svojo background image. Za robove pac uporabljas genericno sliko, ki se lahko ponavlja v x ali y smeri.
Kdor ne navija ni Slovenc, hej, hej, hej!

arjan_t ::

gledam ampak najdem samo take z fiksno višino :8)

Binji ::

Kdor ne navija ni Slovenc, hej, hej, hej!

R33D3M33R ::

Če v Firefoxu (včasih tudi IE) kliknem na googlov Cache moje strani, mi pokaže en velik kup nesreče:



Kje bi lahko ležal vzrok? Tako na prvi pogled se zdi kot da P in UL (LI) elementi izgubijo višino.

Link do cache: povezava

Link do CSS:
default.css
1111.css

Povezavo do strani pa imam v podpisu.

Hvala za vsakršno pomoč.
Moja domača stran: http://andrej.mernik.eu
Na spletu že od junija 2002 ;)
:(){ :|:& };:

KmelJo ::

imam eno vprašanje in sicer:
kako narediti fiksno velikost DIV taga s CSSom: 'div#xx {overflow:auto}', vendar da bo znotraj tega DIVa tudi LIST (< ul>< li>< a>...< /a>< /li>< /ul>) enako deloval v IE kot to dela v FF?
trenutno imam za div določeno fiksno višino, vendar to ne pomaga v IE.

vse pa je zasnovano, da je ta problem odvisen od CSS.
Ni važn', kdo zmaga, sam' da mi ne zgubimo!!!

Zgodovina sprememb…

  • spremenil: KmelJo ()

kriko1 ::

Naredil sem en horizontalen meni ki je centriran. Vendar nikakor se ne morem znebit lukenj med elementi.
Rad bi da je menu že privzeto kompakten, vendar centriran ne glede koliko elementov ima. Nekako takole:
|****---****|
|***------***|

| - rob, * - prazno, "-" - menu element

CSS:

div.menu{
height:33px;
width: 752px;
font-family:Verdana, Arial, Helvetica, sans-serif;
overflow: hidden;
background: url(../images/inner-menu-bg.gif);
/*font-family: Arial, sans-serif;*/
}
div.menu ul{
margin:0;
padding:0;
list-style-type:none;
text-align: center;
}
div.menu ul li{
display:inline;
}
div.menu ul li a{
text-decoration:none;
/*float:left;*/
/*height:25px;*/
margin:0 0 0 0;
padding:2px 4px 2px 4px;
min-width:35px;
}

div.menu a:link, div.menu a:visited{
color:#fff;
background-image:url(images/link.gif);
background-repeat:repeat-x;
background-position:center;
border: 1px solid #f16b12;
}
div.menu a:hover, div.menu a:active{
color:#000;
background-image:url(images/hover.gif);
background-repeat:repeat-x;
background-position:center;
border: 1px solid #e89642;
}

Zgodovina sprememb…

  • spremenil: kriko1 ()

kriko1 ::

Mislim da sem uspešno rešil z nastavljanjem margin-a.

kriko1 ::

Začel sem portati stran na IE, crash sem odpravil ;) ampak sedaj je problem s pngji. Poskusil sem vse živo ampak ne gre.

Tole je recimo en kos kode glave (beri + kot < ali >, slo-tech mi ne dovoli postat):

+div id="header"+
+h1+
+img alt="rumenavrtnica" src="./_themes/main/rumenavrtnica/images/logo.png"/+
+/h1+
...še en ul seznam z par li...
+/div+

V enem splošnem css-u (za vse brskalnike) definiram:
#header{height: 73px; overflow: hidden; background: #0113a3 url(../images/header-bg.png);} /*to je ozadje za preliv*/
#header h1{float: left; padding: 22px 0 0 33px;}
#header ul{float: right; padding: 31px 26px 0;}
#header ul li{float: left; display: inline; padding: 1px 0 0 14px; background: url(../images/bullet-menu.gif) no-repeat 0 0; margin-left: 33px;}
#header images{display: block;}

Stvar dela vsepovsod razen v IE kjer pride stvar grda samo zaradi pngja (elementi zgledajo pravilno postavljeni). Poskusil sem z več png-fixi, ampak nobeden zgleda kot da ne deluje. V IE css (samo pri ie se naloži) sem dodal:

#header img {behavior: url(./_server/design/iepngfix.htc); }

ampak png je še vedno obrobljen z belo barvo. Stvar reagira ko dam displa:none; samo ne reši težave s transparentnim logotipom :'(
Ima kdo izkušnje z pngji? Ali je tukaj kaka fora ker je png na png ozadju?

Zgodovina sprememb…

  • spremenil: kriko1 ()

Tody ::

kot prvo:

Uporabi (st.koda ) moja koda (/st.koda) za to da ti sprocesira kodo ()--> < >

IE sam po sebi ne prebavlja prozornih png-jev

Probaj kaj od tega ali tega

kriko1 ::

Hvala, toda ravno to sem poizkušal z DXImageTransform, praktično kar uporabljajo te skripte.
Sem pa ugotovil da zadeva deluje če imaš indexed png, kar pa po eni strani naredi gnil obroč okoli prelivov, kor pri gifu (praktično malo boljše). Rešil sem tako da sem okoli slike naredil še 1px svetlega preliva v belo barvo, kar nekoliko zamegli napako - vsaj na moji temi (seveda to ne izpade lepo na temnih barvah) .
Dirty stuff.

Veron ::

težava se mi pojavila z eno simpl stranjo... (FF in opera pokažeta normalno - čeprav opera neki muti s pisavam), medtem ko IE pa čisto mim prikaže (niti meni ne dela) ;(

source kodo se da dobit preko FF. Bi znal kdo pomagat?

bluefish ::

meni v IE7 deluje čisto ok, le spodnji del strani je grdo zamaknjen. Malo poglej torej v to smer. Prilagajanja za IE6 pa se niti ne trudi preveč.

Veron ::


takle zmazek dobim v IE6 (in IE7) + v IE mi ne delujejo podmeniji

Zgodovina sprememb…

  • spremenil: Veron ()

kriko1 ::

@Veron: Za IE6 in 7 naredi posebej stylesheet, tako sem jaz rešil cake na teh dveh brskalnikih.

Road Runner ::

Lahko pa naredis to kar delamo vsi ostali - po korakih se prebijas cez css in isces kateri del je probleticen, ki povzroca drugacen izris v razlicnih brskalnikih. Ko ga najdes, ves da ga moras odstraniti, ce zelis ohraniti konsistenten izgled. Vedno pa se da enako zadevo narisati na malce drugacen nacin, ki bo podprt povsod. Na zacetku je delo sicer zamudno, vendar po par narejenih straneh hitro pogruntas kaj vendo dela probleme in zato s tistim sploh ne zacnes.
http://dusan.fora.si/blog/ (742617000027)

Veron ::

IE7 sem uspel popravit, da deluje vse tako kot je treba (spodna slikca (dno) je na pravem mestu in meni tudi normalno dela).

Moram se lotit še IE6.

Sem si pa poslužil z
< !--[if IE 7]>
< link rel="stylesheet" type="text/css" media="screen" href="styleIE7.css" />
< ![endif]-->

Enako bom naredil drug CSS za IE6, opera do sedaj ni imela težav, edino motijo me pisave. Je podobna zadeva tud za opero?

kriko1 ::

Poglej kak font-family uporabljaš, da nimaš v operi nastavljene druge fonte za specifično družino kot pa v firefoxu.

Tody ::

Za vse, ki bi radi vedeli vse o CSS in za tiste ki bi radi vedeli samo en del

SitePoint

Veron ::

Zadevo sm uspel nekako rešit, če odrežem nogo (spodno sliko) in višino strani dam na 100%, sam to mi ne ustreza. Ne najdem pa, če bi se dalo narest, da bi recimo vstopni index reku:
if ie6 ali starejše > preusmeri na > ie6.php
if other > preusmeri page.php

edit: urejena preusmeritev, vendar trenutno
if ie 6 > bla bla, ampak me samo še zanima, ali bo to veljalo za tudi starejše kot 6?

Zgodovina sprememb…

  • spremenil: Veron ()

Veron ::

urejena zadeva 0:)

Veron ::

matr ko se ne da urejat par ur starih postov :(

Uglavnem ostaja mi samo še uganka pri IE6 zakaj ne deluje
#meni li:hover {
background-color: #7E8459;
}

kriko1 ::

Mislim da pseudo-razredi niso podprti v IE6, razen za linke. Meni tudi menu ne menja ozadja, ko se premaknem z miško čez v IE6.

Zgodovina sprememb…

  • spremenil: kriko1 ()

Road Runner ::

oz., ce po kmecko povem kar je razlozil ze kriko1, :hover bo v IE delal le na a elementu, torej a:hover
http://dusan.fora.si/blog/ (742617000027)

Veron ::

še ena zadeva, ie6 + .png slike

Ni mi jasno, od kje se prikaže neko senčenje preko slike, ko hočem dati png sliko v nogo

slika, kako zgleda:

Sem probal poiskat in odstranit iz code vse možne backgrounde in povsod kjer je bila hax koda za barvo... pa še kr po pokaže

kaka ideja al pač pustim jpg (dost slabša kvaliteta slikce)

kriko1 ::

Uporabi fix, primer:
#glava img {behavior: url('./_server/design/pngbehavior.htc'); width:29px; height:29px;}


Fix dobiš na netu, google.

Veron ::

nespremenjano :(

http://webfx.eae.net/dhtml/pngbehavior/... - tole sem probal

kriko1 ::

Kaj pa če shraniš png kot "indexiran" namesto rgb? Sem imel isto problem z logotipom - neka fora mora bit da ta fix ne dela, menda če je spodaj še en png - ne vem točno ker se nisem preveč ubadal, ampak ko sem png shranil kot indexiran je stvar delala bp tudi v ie.

KmelJo ::

LINK - ta link vsebuje fajle potrebne za pravilen prikaz .png-jev v IE6+!
potrebna fajla sta "iepngfix.htc" in "blank.gif". (primer si lahko pogledaš TUKAJ)
Ni važn', kdo zmaga, sam' da mi ne zgubimo!!!

kriko1 ::

Ustvaril sem en menu s pomočjo tabele (koda + CSS):
Menu

Elementi v meniju se lepo dinamično krčijo in širijo, odvisno koliko jih je, kar me pa moti je to da mora uporabnik prav točno pociljat na sam link (text) da zadevo lahko klikne. Kako bi lahko naredil še celo polje okoli "klikabilno"? To če dam link izven td ne pomaga...

Hair ::

drgač ti priporočam, da meni narediš s seznamom, ker je dost bolj pregledno...
kar se pa tvojega vprašanja tiče pa:

.nav a {
display:block;
height:24px
}
Whenever people agree with me, I feel I must be wrong.

Zgodovina sprememb…

  • spremenil: Hair ()

kriko1 ::

To je točno to! Hvala!

kriko1 ::

Sedaj sem se spet spotaknil ob pngje. Logotip sem rešil tako da sem ga spremenil v indexiran namesto rgb.
Ampak pri majhnih ikoncah je to moteče, ker se izgubi tista ostra lepota, rob kjer je meja med transparentnim ozadjem in naslikanim pride "nagrižen" kot pri gifu.

Tukaj je sample menuja, kjer stvar ne dela:
http://files.myopera.com/kriko/rvrt/sam...

Slikca:


In fix ki ga uporabljam (tisti blank gifi so na mestu):
http://files.myopera.com/kriko/rvrt/png...

Se da to sploh kako rešit v IE 6? Ker indexirani pngji nekako izgubijo smisel....

Zgodovina sprememb…

  • spremenil: kriko1 ()

Road Runner ::

teorija:
PNG v IE

praksa:
pazi ze ko oblikujes, da ne bo potrebnih pngjev, s tem se resis tezav :)
http://dusan.fora.si/blog/ (742617000027)

kriko1 ::

Zanimivo, bom poskusil jutri.
Ampak pngji so super stvar pri takih majhnih detajlih, ko je pomembno da se ohrani tista precizna slika. Ja, no žal je tukaj IE6 ki pokvari zabavo...

Road Runner ::

Marsikaj je super, tudi CSS3, pa ga zal ne moremo uporabljati kot bi hoteli :)
http://dusan.fora.si/blog/ (742617000027)

kriko1 ::

Stvar zgleda da deluje, samo še vedno ne v IE6 (sploh ni slike - weird). Slika se pa tudi samo prikaže če dam kak tekst not v tisti div.
Mogoče zato ker imam v menu-personal že en background (vendar ta je za slikco ki jo hočem dat not)?

Koda z menu samplom:
Test

Road Runner ::

Na div imas display:inline
inline elementom ne dolocas sirine in visine ti (kot si to optimisticno poizkusil), temvec je dolocena glede na njihovo vsebino. In ker je tvoj div prazen, je torej velik tocno 0. Zato pa v njem ne vidis ozadja.
http://dusan.fora.si/blog/ (742617000027)

kriko1 ::

Aha, ampak če ne dam inline potem mi gre menu po gobe (se zlomi navzdol).
Po mojem je še najboljša rešitev da dam v _header.html (kjer je ta menu) pogojne stavke za detekcijo IE6 in v primeru da ga zazna, naloži gif namesto png?

Ziga Dolhar ::

Nisem šel gledat tvoje kode - ampak, mrbit float: left?
https://dolhar.si/

kriko1 ::

Nope, float left / right ga zabriše čisto drugam. Ampak drugače zgleda da fix dela, ker se vidi košček ikonce na levi strani menuja.
Je mogoče še kaka možnost da bi to implementiral v meni narejen iz unsorted list, s tem da ga ne polomim? Ali mogoče kako drugače naredim menu da lahko dam notri ta fix.
Meni je pomembno edino da je menu centriran, s tem ko dodajaš nove elemente se sam ponovno scentrira (ni fiksno določena pozicija).
Menu je v div .personal-st (kot v samplu), ta pa ima naslednje lastnosti:

div.personal-st {
background:#FFFFFF url(../images/personal_menu.png) repeat-x scroll 0pt;
border-bottom:2px solid #B36500;
border-right:2px solid #B36500;
height:22px;
margin-bottom:15px;
overflow:hidden;
width:auto;
}

Road Runner ::

To da bi sel server-side delat detekcijo browserja ni najboljse. Ce nekdo spoofa user agent se mu zadeva prikaze narobe.

Osebno se mi najboljsi nacin zdi ta, da s css selektorji locis pravila za browserje. Vsi browserji namrec ne podpirajo vseh selectorjev, nekateri pa dolocene malo napacno. Sploh za IE so zadeve zelo enostavne:
/* pravilo, ki ga razumejo vsi browserji */
.personal-st { background:url(foo.gif); }

/* pravilo, ki ga razumejo samo boljsi browserji (v praksi vse kar ni IE6 ali starejse) */
html > body .personal-st { background:url(foo.png); }

S tem si dosegel to, da v vsi spodobni browserji uporabijo png za ozadje (ker pravilo prepise prejsnjega), IE pa upoabi .gif, ker ni razumel naslednjega pravila

CSS selectors za opis selectorjev
CSS browser detection za primere kako s cssjem naslovis samo dolocen browser
http://dusan.fora.si/blog/ (742617000027)

kriko1 ::

Delam na novo menu, poskušam tako da se bo dalo s css fixat stvar kot si omenil.

Jackass ::

Živjo!

Želim narest predogled slike na način kot npr. pri AGT ali mimovrste, ko se cela stran zatemni, na sredini zaslona pa se v ospredju prikaže slika.
Zanima me kako naj raztegnem div, s katerim bi zatemnil stran, preko celotne strani (predvsem višina me matra)?
jAcKaSS

Zgodovina sprememb…

  • spremenil: Jackass ()

bluefish ::

to je narejeno v JavaScript-u - Slimbox.

MihaFirst ::

Na strani mam več layerjev, vsak ma svoj ID.

Kako bi v poseben css za vsakega posebej določil layer-background-color?

MihaFirst ::

Hvala, sem že uredil.

Jackass ::

blueFish: Najlepša hvala!
jAcKaSS
««
17 / 26
»»


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
»

poravnava li elementov

Oddelek: Izdelava spletišč
82169 (2034) boss-tech
»

Wampserver in Firefox

Oddelek: Izdelava spletišč
61873 (1753) jonystar
»

CSS problemi (strani: 1 2 )

Oddelek: Izdelava spletišč
519924 (7723) nuuush
»

[CSS]Pozicioniranje footer diva

Oddelek: Izdelava spletišč
62479 (2426) amaze646
»

CSS background-image in IE6?

Oddelek: Izdelava spletišč
133096 (2962) Road Runner

Več podobnih tem