4 replies [Last post]
Admaker
Admaker's picture
User offline. Last seen 1 year 22 weeks ago. Offline
newbie
Timezone: GMT+2
Joined: 2010-09-01
Posts: 1
Points: 2

Please help! I know by 99% that this is the right CSS but the background-image just won't show up!
Please help me find whats wrong...

HTML:
==================================================

Teknikhandel – Din leverantör av tillbehör

Sök




Lorem ipsum dolor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sagittis nisi at purus vestibulum ullamcorper.

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

Köp produkt!

Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn
Köp produkt!
Produktnamn

CSS:
==================================================

#container {
width: 960px;
margin: auto;
text-align: left;
overflow: hidden;
}

html, body {

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

}

/* STANDARD
----------------------------------------------------------------------------------------------------*/

#secondary1 {
background: #dfdfdf;
height: 1900px;

}

#secondary1 p, a{
padding-left: 10px;
}

#secondary2 {
background: #FFFFFFF;
}

#secondary4, #secondary5, #secondary6, #secondary7, #secondary8, #secondary9 {
background: #FFFFFF;
}

#secondary4, #secondary5 {
height: 350px;
}

#secondary6, #secondary7, #secondary8, #secondary9 {
height: 285px;
}

#mainContent p {
padding: 0;
}

#mainContent {
background: #FFFFF;
}

#footer {

}

#header {
height: 147px;
background: #000000;
}

#main_content_menu {
height: 78px;
background: #ffffff;
}

#col1 {
background: #383838;
height: 40px;

}

#col1 p{
font-family:Arial, Helvetica, Verdana;
font-color: #ffffff;
font-size: 16px;
font-weight: bold;

}

#col2 {
background: #ffffff;
height: 40px;

}

p.ex
{
padding-left: 10px;

}

div.img
{
margin: 1px;
border: 0px solid #000;
height: auto;
width: auto;
float: left;
padding-left:4px;

}

div.img img
{
display: inline;
margin: 1px;
border: 1px solid #000;
}

div.img a:hover img {border: 1px solid #000;}
div.desc
{
text-align: center;
font-size: 9px;
font-weight: bold;
width: 80px;
margin: 2px;
}

prod_h1
{
font: Arial, Helvetica, sans-serif;
font-size:16px;
font-weight: bold;
padding-left: 10px;
}

h2
{
font: Arial, Helvetica, sans-serif;
font-size:12px;
font-weight: bold;
padding-left: 10px;
}

#left_menu
{

}

div.left_menu a.menu_link:link {
color:#000000; font-size: 10pt; font-weight: bold; text-decoration:none;
}

div.left_menu a.menu_link:visited {
color:#000000; font-size: 10pt; font-weight: bold; text-decoration:none;
}

div.left_menu a.menu_link:hover {
color:#999999; font-size: 10pt; font-weight: bold; text-decoration:none;
}

div.left_menu a.menu_link:active {
color:#000000; font-size: 10pt; font-weight: bold; text-decoration:none;

}

/*NAVIGERING*/

#main-nav { height: 45px; }
#main-nav dl { margin: 0; padding: 0; }

/* IE5 Mac Hack \*/
#main-nav { padding-left: 0px; }
/*/
#main-nav { padding-left: 11px; overflow: hidden; }
/* End Hack */

#main-nav dt { float: left; }

#main-nav dt a {
display: block;
height: 0px !important;
height /**/:6px; /* IE 5/Win hack */
padding: 45px 0 0 0;
overflow: hidden;
background-repeat: no-repeat;
}

#main-nav dt a:hover {
background-position: 0 -45px;
}

#main-nav dt a:active {
background-position: 0 -90px;
}

#main-nav dt#hem,
#main-nav dt#hem a { width: 78px; background-image: url(../images/menu_01.png); }

#main-nav dt#tillbehorsguide,
#main-nav dt#tillbehorsguide a { width: 161px; background-image: url(../images/menu_02.png); }

#main-nav dt#varumarken,
#main-nav dt#varumarken a { width: 173px; background-image: url(../images/menu_03.png); }

#main-nav dt#kundservice,
#main-nav dt#kundservice a { width: 132px; background-image: url(../images/menu_04.png); }

#main-nav dt#search,
#main-nav dt#search a { width: 58px; background-image: url(../images/menu_05.png); }

#main-nav dt#empty,
#main-nav dt#empty a { width: 358px; background-image: url(../images/menu_06.png); }

body.hem dt#hem,
body.hem dt#hem a,

body.tillbehorsguide dt#tillbehorsguide,
body.tillbehorsguide dt#tillbehorsguide a,

body.forelasningar dt#forelasningar,
body.forelasningar dt#forelasningar a,

body.varumarken dt#varumarken,
body.varumarken dt#varumarken a,

body.kundservice dt#kundservice,
body.kundservice dt#kundservice a,

body.search dt#search,
body.search dt#search a,

body.empty dt#empty,
body.empty dt#empty a,

{
background-position: 0 -90px;
}

#searchform
{
padding-left: 10px;
}

CupidsToejam
CupidsToejam's picture
User offline. Last seen 1 week 3 days ago. Offline
rank Guru
Guru
Timezone: GMT-6
Joined: 2008-08-15
Posts: 2634
Points: 1552

try

try this..

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

If this doesnt work, take a close look at the image path and file name


First basic few steps in building a webpage
1. Gather and collect content.
2. Organize the content into meaningful semantic valid HTML
3. Design the prototype
4. Style using CSS

http://www.pixelbehavior.com

guru_kicker
guru_kicker's picture
User offline. Last seen 1 year 22 weeks ago. Offline
newbie
Timezone: GMT+1
Joined: 2010-09-01
Posts: 3
Points: 4

all you need to do is make

all you need to do is make sure that the image exist in the path specified.
if it does, it might not be showing up because you are a *insulting and offensive phrase removed*

User acount suspended - Hugo

douglaslazarini
douglaslazarini's picture
User offline. Last seen 1 year 21 weeks ago. Offline
newbie
Timezone: GMT-3
Joined: 2010-09-01
Posts: 1
Points: 1

try create a DIV

try create a DIV for bckground and use z-index for the layer
 
html
 
<div id="bg"></div>
 
css
 
bg {
position:absolute;
left:0px;
top:0px;
width:100%;
background:url(../images/bg.png) repeat-x;
 
z-index:-1;
}

}

CupidsToejam
CupidsToejam's picture
User offline. Last seen 1 week 3 days ago. Offline
rank Guru
Guru
Timezone: GMT-6
Joined: 2008-08-15
Posts: 2634
Points: 1552

no, dont do what

no, dont do what douglaslazarini suggests. That is not the best way. keep to the basics and you'll be fine. Do what I said


First basic few steps in building a webpage
1. Gather and collect content.
2. Organize the content into meaningful semantic valid HTML
3. Design the prototype
4. Style using CSS

http://www.pixelbehavior.com