Får ikke til å bruke repeat-x

[anerz]

Har et bakgrunnsbilde(bakgrunn.png) som er et bilde med bredde på 50pixler og høyde på 400. Dette bildet er fadet nedover så vil være helt hvit i bunn.

Vil at bildet bare skal repeteres horisontalt, prøvd å satt inn repeat-x; men da vil ikke bildet vises i det hele tatt.

 

Kode fra css fila er:

background-image:url(../images/bakgrunn.png) repeat-x;

 

Hva må jeg endre for at dette skal virke

 

mvh

Anders

[Kim T]

du kan ikke sette en fast bredde og høyde på bildet hvis du skal repetere x. Da vil den bare repetere seg i de 50px du har satt. Fjern bredden og se om det ikke skjer noe. Er det eneste jeg kan komme på at du har gjort gærnt i dette tilfellet.

 

Kim...

Endret 22. januar 2008 av Kim T

[anerz]

har ikke definert bredde eller høyde på bildet.

koden i css fila er lagt ved under. Er kode fra css fila i en joomla template hvis det kan hjelpe noen.

 

body {

margin: 15px;

height: 100%;

padding: 0px;

font-family: Arial, Helvetica, Sans Serif;

line-height: 120%;

font-size: 11px;

color: #333333;

background: #ffffff;

background-image:url(../images/bakgrunn.png) repeat-x;

 

 

}

[Runar0]

mulig det kommer av at repeat-x hører til background-repeat og ikkje background-image. Prøv følgende:

 

body {
....
background: #FFF;
background-image: url('../images/bakgrunn.png');
background-repeat: repeat-x;
}

Eventuelt

body {
...
background: #FFF url('../images/bakgrunn.png') repeat-x;
}

Endret 22. januar 2008 av Runar0

[anerz]

skjønnte feilen da jeg så eksemplet. Når jeg prøvde repeat-x på egen linje glemte jeg ; etter background-image:url(../images/bakgrunn.png) <--

Fikk på semikolon så fungerte dette bra.

Ser nå slik ut.

background-image:url('../images/bakgrunn.png');

background-repeat: repeat-x;

 

takker

[Jesper Karsrud]

Det jeg synes er best, er å drite i å definere background-xxxx, og heller bare bruke background. Denne støtter alle mulige saker og ting, og kan spare deg for veldig mange linjer i koden din:

 

	background: #DDD url() repeat/repeat-x/repeat-y/no-repeat scroll/fixed top left/top center/top right/center left/center center/center right/bottom left/bottom center/bottom right/x-% y-%/x-pos y-pos;