I seem to always have this problem when I add an image to my CSS...the image I'm using as a background doesn't show up.
Here's my CSS:


A:link
{ text-decoration: none; color:#000000; }
A:visited
{ text-decoration: none; color:#000000; }
A:active
{ text-decoration: underline; color:#000000; }
A:hover
{ text-decoration: underline overline; color:#000000;

background-image: url(whiteheart.gif);


h1 {font-family: Arial;
color: value; [your font color (#BD2121)] }

p {font-family:Arial;
color: value; [your font color (#BD2121)] }

body
{background-image: url(whiteheart.gif);
background-repeat: repeat;
background-attachment: fixed;
font-family: Arial;
color: #BD2121 ;
letter-spacing: 1pt;
font-weight: bold;
font-size: x-small;

scrollbar-face-color : #BD2121;
scrollbar-highlight-color : #000000;
scrollbar-3dlight-color : #000000;
scrollbar-shadow-color : #000000;
scrollbar-darkshadow-color : #000000;
scrollbar-track-color : #000000;
scrollbar-arrow-color : #000000;

margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
}

td
{ font-family: Arial;
color: #000000;
padding-left: 2cm;
padding-right: 2cm;
padding-top: 2cm;
padding-bottom: 2cm;
padding: 2cm;
padding: 2cm 4cm;

input, textarea
{ background: #000000 url(whiteheart.gif);
font-family: Arial;
color: #000000;
border-style: solid;
border-color: #000000;
border-width: 4px;


Keep in mind, I am still working on this...lol...but I really want my background to show up. Can ya help me?

are you sure the image isnt in a different folder or you havent spelt it right.. i think you can delete this bit:
[just the first one]
background-image: url(whiteheart.gif);

I made some things that i changed [they were incorrect coding] red :):

A:link
{ text-decoration: none; color:#000000; }
A:visited
{ text-decoration: none; color:#000000; }
A:active
{ text-decoration: underline; color:#000000; }
A:hover
{ text-decoration: underline overline; color:#000000;

background-image: url('whiteheart.gif');


h1 {font-family: Arial;
color: #BD2121; }

p {font-family:Arial;
color: #BD2121; }

body
{background-image: url('whiteheart.gif');
background-repeat: repeat;
background-attachment: fixed;
font-family: Arial;
color: #BD2121 ;
letter-spacing: 1pt;
font-weight: bold;
font-size: x-small;

scrollbar-face-color : #BD2121;
scrollbar-highlight-color : #000000;
scrollbar-3dlight-color : #000000;
scrollbar-shadow-color : #000000;
scrollbar-darkshadow-color : #000000;
scrollbar-track-color : #000000;
scrollbar-arrow-color : #000000;

margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
}

td
{ font-family: Arial;
color: #000000;
padding-left: 2cm;
padding-right: 2cm;
padding-top: 2cm;
padding-bottom: 2cm;
padding: 2cm;
padding: 2cm 4cm; }

input, textarea
{ background-color: #000000;
background-image: url('whiteheart.gif');
font-family: Arial;
color: #000000;
border-style: solid;
border-color: #000000;
border-width: 4px; }


You forgot several } things at the end. Also, this may not have affected anything, but it's good practice to put quotes around URL values, like with background-image: url('URL');.

Also, when it said color: value [your font color (#BD2121)], you're supposed to replace the word 'value' with your color.. #BD2121. The thing in brackets is just an explanation of the coding :lol:

I hope that helps!

There also lacks a closing bracket ( } ) after this:

A:hover { text-decoration: underline overline; color:#000000; background-image: url('whiteheart.gif'); }

I got it working now, thanks for your help!

If you were you have a background image, but want the rest of the board (I use InvisionFree) to be mobile, how can that happen?