Test Page With CSS Is Not Working After FTP To Server

B

Beth

I am a newbie at creating HTML by hand with CSS. I have a simple page that
works when I view it in FrontPage and also when I go through Windows Explorer
to view it. After I load it with FTP to my host, it does not appear that the
CSS document is being recognized nor are the images being found. I tried
calling my host and they said it is a coding problem.

Any ideas why it works before it is transfered and not after?
 
R

Ronx

A link to the page will help diagnose problems.
Check that the links in the page are not pointing to folders on your PC,
they should be to files on the server.

When you uploaded the page, did you also upload the images and CSS
files?
 
?

.._..

1. Make sure your FTP program is transfering in ascii mode.

2. Make sure the paths make sense in the context of the server. When all
else fails, use absolute from root paths;

i.e. img src="/images/file.gif" rather than anything else.

Post samples of your CSS code, that would help get something other than a
wild guess.
 
B

Beth

The site I am using to test my page is:

http://dataentryathome.info

The images and css document are loaded on the server.

The site and code are simple. I am trying to code so my website appears
correctly with different monitor sizes and this is a test sample.

Thanks for your help!
 
B

Beth

Here is my html code and my css is below that.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>Great Gift Ideas For Pets And Their People</title>

<meta name="keywords" content="dog gifts, gifts under $10, dog collar,
personalized collar, personalized dog collar,nascar for dogs, NFL for dogs,
football jersey for dogs, MLB for dogs, jersey for dogs, baseball jersey for
dogs, ornament" />


<link rel="stylesheet" type="text/css" href="homepage-style.css">

</head>

<body>

<div id="header">

<h1>Cleveland Pet Store.Com</h1>
<h2>Gifts For Pets And Their People</h2>

</div>

<div id="countdown-image"

<a href="http://siggiez.com/countdownz/ch/index2.cgi">
<img src="http://siggiez.com/countdownz/ch/bans/03.jpg" width="600"
height="60" border="0" title="Siggiez Countdown Banners"></a>

</div>

<div id="content">

<div id="navbar">

</div>

<div id="main-text">

<h3>Featured Gifts Under $10</h3>


<img src="images/pawprintornament.jpg" alt=" Paw Print ornament"/>

<img src="images/santapawscard_details.jpg" alt="Santa Paws Rawhide Card"/>

<img src="images/petsmartcollar.jpg" alt="Personalized Collar"/>



</div>
</div>



</body>

</html>

CSS Code:

body {background-color: #ffffff;
margin: 0;}



#header {background-color: #ffffff;
margin: .5em;}



h1 {color: #800000;
font-size: 2.5em;
text-align: center;}


h2 {color: #000000;
font-size: 1.25em;
font-weight: bold;
text-align: center;
margin: 2em;}

#content {position: relative;
width: 779px;}


#countdown-image {text-align: center;
position: relative;
background-color: #ffffff;
margin: .5em;
margin-top: 0px;}

#main-text { background-color: #ffffff;
margin-left: 198px;
margin-top: 32px;
border: solid 1px #800000;}

h3 {color: #800000;
font-size: 1.5em;
text-align: center;}

#navbar {position: absolute;
top: 32px;
left:0px;
background-color: #ffffff;
width: 182px;
margin-right: .5em;
margin-left: .5em;}
 
R

Ronx

Using the names and paths in the page, neither the images nor the CSS
file are on the server.

The css should be at http://dataentryathome.info/homepage-style.css
and images in the folder at http://dataentryathome.info/images/

You are using a Unix server which is CaSe sensitive: for example,
Index.htm and index.htm are two different files on Unix, but the same
file on Windows. Make sure the links in the page are the same case as
the file names.

--
Ron Symonds - Microsoft MVP (Expression)
Reply only to group - emails will be deleted unread.

http://www.rxs-enterprises.org/fp
 
B

Beth

Here is my html code and my css is below that. The site is simple and I am
just trying to test my coding to see if it responds the same for difference
montior sizes.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title>Great Gift Ideas For Pets And Their People</title>

<meta name="keywords" content="dog gifts, gifts under $10, dog collar,
personalized collar, personalized dog collar,nascar for dogs, NFL for dogs,
football jersey for dogs, MLB for dogs, jersey for dogs, baseball jersey for
dogs, ornament" />


<link rel="stylesheet" type="text/css" href="homepage-style.css">

</head>

<body>

<div id="header">

<h1>Cleveland Pet Store.Com</h1>
<h2>Gifts For Pets And Their People</h2>

</div>

<div id="countdown-image"

<a href="http://siggiez.com/countdownz/ch/index2.cgi">
<img src="http://siggiez.com/countdownz/ch/bans/03.jpg" width="600"
height="60" border="0" title="Siggiez Countdown Banners"></a>

</div>

<div id="content">

<div id="navbar">

</div>

<div id="main-text">

<h3>Featured Gifts Under $10</h3>


<img src="images/pawprintornament.jpg" alt=" Paw Print ornament"/>

<img src="images/santapawscard_details.jpg" alt="Santa Paws Rawhide Card"/>

<img src="images/petsmartcollar.jpg" alt="Personalized Collar"/>



</div>
</div>



</body>

</html>

CSS Code:

body {background-color: #ffffff;
margin: 0;}



#header {background-color: #ffffff;
margin: .5em;}



h1 {color: #800000;
font-size: 2.5em;
text-align: center;}


h2 {color: #000000;
font-size: 1.25em;
font-weight: bold;
text-align: center;
margin: 2em;}

#content {position: relative;
width: 779px;}


#countdown-image {text-align: center;
position: relative;
background-color: #ffffff;
margin: .5em;
margin-top: 0px;}

#main-text { background-color: #ffffff;
margin-left: 198px;
margin-top: 32px;
border: solid 1px #800000;}

h3 {color: #800000;
font-size: 1.5em;
text-align: center;}

#navbar {position: absolute;
top: 32px;
left:0px;
background-color: #ffffff;
width: 182px;
margin-right: .5em;
margin-left: .5em;}
 
B

Beth

Thanks for your help! My problem turned out to be a case sensitvity issue
with my images and css on the Unix server. This newbie has learned her lesson
in choosing a naming convention and sticking with it.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top