får ikke til å bruke "background-image" (CSS)

stelar7 · 1. februar 2011

html filen:

<!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>
<link rel="shortcut icon" href="favicon.ico"/>
<link href="http://www.teameq.co.cc/teameq-filer/style.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>
Team Earthquake
</title>
</head>
<body>
<div id="wrap">
<div id="header" style="background-image: url(http://www.teameq.co.cc/teameq-filer/header.jpg)">
</div>
<div id="topnav">
<div class="topnavlinks">
<ul>
<li><a href="http://www.teameq.co.cc/games">Games</a></li>
<li><a href="http://www.teameq.co.cc/members">Members</a></li>
<li><a href="http://www.teameq.co.cc/information">Information</a></li>
<li><a href="http://www.teameq.co.cc/forum">Forum</a></li>
</ul>
</div>
</div>
<div id="leftbar">This is the leftbar</div>
<div id="rigthbar">This is the rigthbar</div>
<div id="body">This is the body</div>
<div id="footer">This is the footer</div>
</div>
</body></html>

 style="background-image: url(http://www.teameq.co.cc/teameq-filer/header.jpg)

er forhåpentligvis bare en midlertidig løsning...

.css filen:

body	{
background-color:gray;
}

#container	{
position:absolute;
height:850px;
width:900px;
}

#wrap	{
width:900px;
margin:1px auto;
}

#header	{
width:900px;
height:145px;
margin:0;
padding:0;
background-color:black;
border-bottom: 2px solid #000000;
color:white;
}

#topnav	{
height:35px;
clear:both;
background-color:#FF6161;
}

#topnav a	{
color:#000000;
text-decoration:underline;
font-weight:bold;
font-family:Verdana;
font-size:14px;
}

#topnav a:visited	{
color:#4D4D4D;
text-decoration:underline;
font-weight:bold;
}

#topnav a:hover	{
color:#4D4D4D;
text-decoration:none;
font-weight:bold;
}

.topnavlinks	{
position:absolute; top:161px; left:340px;
}

.topnavlinks ul	{
margin:1px;
}

.topnavlinks li	{
margin: 0px 80px 0px 0px; 
list-style-type:none;
display:inline;
}

#rigthbar	{
float:right;
width:150px;
height:550px;
background-color:green;
color:yellow;
border-left:1px dashed #000000;
border-top:1px solid #000000;
border-bottom:1px solid #000000;
}

#leftbar	{
float:left;
width:150px;
height:550px;
background-color:green;
color:yellow;
border-right:1px dashed #000000;
border-top:1px solid #000000;
}

#body	{
height:550px;
width:750px;
background-color:black;
color:white;
border-top:1px solid #000000;
border-bottom:1px solid #000000;
}

#footer	{
height:35px;
clear:both;
background-color:#FF6161;}

problemet er at bildet ikke vil vises på headeren

siden kan sees på denne siden

p.s work in progress...

Endret 2. februar 2011 av stelar7

MikkelRev · 1. februar 2011

Funker dette?

<div id="header" style="background-image: url(images/image317.jpg);">This is the header</div>

stelar7 · 2. februar 2011

Funker dette?

<div id="header" style="background-image: url(images/image317.jpg);">This is the header</div>

funket helt flott det!

agm · 2. februar 2011

Kan det hende du setter en bakgrunn senere i CSS-filen som overskriver det du setter i #header?

Du kan jo prøve

background:#000 url(images/image317.jpg) !important;

stelar7 · 2. februar 2011

Kan det hende du setter en bakgrunn senere i CSS-filen som overskriver det du setter i #header?

Du kan jo prøve
background:#000 url(images/image317.jpg) !important;

funker ikke

Matsemann · 2. februar 2011

background-image: url('images/image317.jpg');

(fnutter)

evt. få se hele koden.

agm · 2. februar 2011

Kan nevnes at url'en er relativ i forhold til stilsettets plassering.

Siden de begge ligger i samme mappe, trenger du bare peke til header.jpg i .css'en. Pr. nå leter den etter teameq-filer/teameq-filer/header.jpg av det jeg kan se.

Det jeg mener er at når du i HTML-filen sier

<div id="header" style="background-image:url(teameq_filer/header.jpg)"></div>

så tilsvarer det

#header{background-image:url(header.jpg)}

i CSS-filen

Endret 2. februar 2011 av agm

MikkelRev · 3. februar 2011

ja hva er det som ikke fungerer nå? Og hva gjør egentlig disse linjene i css'en til #header?

width:900px;

background-color:black;

color:white;

Endret 3. februar 2011 av MikkelRev

stelar7 · 3. februar 2011

ja hva er det som ikke fungerer nå? Og hva gjør egentlig disse linjene i css'en til #header?

width:900px;

background-color:black;

color:white;

hva er galt med de?

Endret 3. februar 2011 av stelar7

MikkelRev · 3. februar 2011

width'en blir vel bestemt av wrapperen.

background-color vil du vel aldri legge merke til med mindre bildet ikke kan lastes pga en feil.

color har heller ingen nytte da det ikke blir skrevet noen tekst i #header.

stelar7 · 3. februar 2011

width'en blir vel bestemt av wrapperen.

background-color vil du vel aldri legge merke til med mindre bildet ikke kan lastes pga en feil.

color har heller ingen nytte da det ikke blir skrevet noen tekst i #header.

lagde headeren før eg tenkte på en wrapper...

background-color var får å vise hvordan elementene ville vere i forhold til hverandre

hadde tekst i den før

Endret 3. februar 2011 av stelar7

Matsemann · 3. februar 2011

background-color vil du vel aldri legge merke til med mindre bildet ikke kan lastes pga en feil.

Liten digresjon: Jeg kjører alltid background-color i noe lignende fargen på et evt. bakgrunnsbilde har. Selv surfer jeg en del med bilder avslått på tlf. osv., og da er det veldig irriterende med sider som egentlig har en mørk bakgrunn og hvit tekst. Men siden jeg har slått av bilder, ser jeg hvit tekst på hvit bakgrunn.

Logg inn

får ikke til å bruke "background-image" (CSS)

Anbefalte innlegg

stelar7

Lenke til kommentar

Videoannonse

MikkelRev

Lenke til kommentar

stelar7

Lenke til kommentar

agm

Lenke til kommentar

stelar7

Lenke til kommentar

Matsemann

Lenke til kommentar

agm

Lenke til kommentar

MikkelRev

Lenke til kommentar

stelar7

Lenke til kommentar

MikkelRev

Lenke til kommentar

stelar7

Lenke til kommentar

Matsemann

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer