Help - Search - Members - Calendar
Full Version: HTML/CSS WONT WORK
HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)
wdgrmusic
hi everyone i am having the hardest time trying to figure this problem out... here is what is happening i am trying to make a webpage for a friend using a css template i found online... i am going to be running to webpage off my computer using abyss webserver and am using dreamweaver as my html editor here is whats happening everytime that i preview the webpage everything looks fine locally but as soon as i broadcast the page over the internet it comes up alpha numeric no picture nothing it looks all text based i have tried all kinds of things and i am puzzled as to what this could be!!! please help me!!!!

here is my html coding and along with it is the css link... the link to the css sheet is http://www.mediafire.com/file/3be5jwjcb1yv5q7/style.css


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<title>Imagination | Free CSS Template by Rambling Soul</title>

<link href="http://www.mediafire.com/file/3be5jwjcb1yv5q7/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="topbar">
<div id="TopSection">
<h1 id="sitename"><span><a href="#">I</a></span><a href="#">magination</a></h1>
<div id="topbarnav"> <span class="topnavitems"><a href="#contents">Skip to Contents</a> | <a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/3">Register</a> | <a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/3">Login </a></span><form action="#"><div class="searchform">
<label for="searchtxt">
Search Terms:
</label>
<input class="keywordfield" id="searchtxt"/>
<input type="submit" value="Search" />
</div> </form></div>
<div class="clear"></div>
<ul id="topmenu">
<li class="active"><a href="http://www.mediafire.com/file/2us1bt2u242lta9/index.html">Home</a></li>
<li><a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/blog.html">Food Menu</a></li>
<li><a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/table.html">Menu Items </a></li>
<li><a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/form.html">3 and Out Crew</a></li>
<li><a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/notes.html">Mailing List</a></li>
<li><a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/1.html">Special Events</a></li>
</ul>
</div>
</div>

<div id="wrap">
<div id="header">
<h2 class="introtext">
There is nothing that cannot be achieved by firm <span class="highlight2">imagination.</span>
<head><link href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/style.css" rel="stylesheet" type="text/css" />
</head>
</h2>
</div>
<div id="contents">
<div class="clear"></div>
<div id="aboutdiv">
<h2>What ?</h2>
<p><span class="openquote"></span>Under Construction<img src="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/images/quote2.gif" alt="Closing Quote" /></p>
<h2>About Us</h2>
<p>We were the last 3 guys sitting around a camp fire drinking beer and thought it would be a good idea to open a bar.<br />
<br />
So here we are serving you cold beer, great food, with a friendly staff, and a place you can call home!!!</p>
<p>&nbsp;</p>
<p>Location:</p>
<p>13067 s.w. 112th street Miami, Fl 33186</p>
<p>&nbsp;</p>
<p>Hours Of Operation: </p>
<p>Mon-Thurs :11am to 12midnight</p>
<p>Frid and Sat: 11am to 1am </p>
<p>Sundays: 11am to 10pm </p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><img src="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/images/quote2.gif" alt="Closing Quote" /></p>
</div>
<div id="highlights">
<h2>What's New?</h2>
<ul>
<li><h3><a href="#">Lorem Ipsum</a></h3>
Mug Nights is back On Wendsdays!!! Come Join Us at 3 &amp; out For Mug Nite!!!.
</li>
<li>
<head><link href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/style.css" rel="stylesheet" type="text/css" />
</head>
<h3>Super Bowl Party</h3>
</li>
<li>Join Us Febuary 1st For all You can buffet for Just 30 Dollars !!! . </li>
<li>
<h3>Under Construction</h3>
</li>
<li>Under Construction </li>

</ul>

</div>
<div id="homecontents">
<h2>3 &amp; out and The Super Bowl Party!!!!!</h2>
<span class="postinfo">By Lorem I. Dolor</span>
<img src="file:///C|/Users/Tony Gonzalez/Downloads/Super_Bowl_2011_Official_Logo.png" alt="" width="293" height="297" /><img src="file:///C|/Users/Tony Gonzalez/Pictures/taverngirl.gif" alt="" width="200" height="300" />
<p>Join us for the SuperBowl 3 &amp; Out Party!!!!</p>
<p>
Cras velit libero, lacinia ut, euismod at, semper suscipit, elit. Ut nec mauris at diam dignissim aliquam. Donec eu mi at nisl sagittis tincidunt. Pellentesque feugiat molestie nunc. In lobortis, est eget bibendum hendrerit, ipsum augue venenatis lorem, nec sodales metus arcu sit amet nisi. Duis iaculis orci et tortor. *beep* sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis id lacus. Praesent faucibus, mauris et lobortis tristique, mi justo consectetuer nulla, et pretium mauris lacus ut elit. Etiam leo leo, auctor eget, tristique eu, ultrices eu, lorem. Nulla facilisi. Praesent imperdiet ante elementum nisi vestibulum pharetra. Aliquam ullamcorper, lectus ut rhoncus gravida, ligula velit porttitor nisi, non laoreet diam dui ac mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Cras pharetra pulvinar dolor.
</p>
</div>

<div class="clear"></div>
<div align="center"><font color="#FFFFFF" size="+1"><marquee bgcolor="#000000"
direction="left" loop="20">Site Under Construction Please Execuse our Dust!!!!</marquee></font></div>


</div>

</div>
<div id="footer">
<div id="footercontent">
<div id="previews">
<div class="item">
<a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/new.html"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern204.jpg" alt="" width="100" height="90" /><a href="new.html" onclick="window.open('new.html','popup',& #39;width=250,height=10,scrollbars=yes,resizable=yes,toolbar=no,directories=no,l
ocation=no,menubar=no,status=no,left=50,top=0'); return false"></a>
<span class="caption">Image Caption</span>
</div>
<div class="item">
<a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/barpic.html"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern600.jpg" alt="" width="100" height="90" /><a href="" onclick="window.open('new.html','popup',& #39;width=250,height=10,scrollbars=yes,resizable=yes,toolbar=no,directories=no,l
ocation=no,menubar=no,status=no,left=50,top=0'); return false"></a> <span class="caption">Image Caption</span>
</div>
<div class="item">
<a href="#"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern900.jpg" alt="" width="100" height="90" /></a> <span class="caption">Image Caption</span>
</div>
<div class="item">
<a href=""><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern700.jpg" alt="" width="100" height="90" /><a href="" onclick="window.open('new.html','popup',& #39;width=250,height=10,scrollbars=yes,resizable=yes,toolbar=no,directories=no,l
ocation=no,menubar=no,status=no,left=50,top=0'); return false"></a> <span class="caption">Image Caption</span> <span class="caption">
</div>
<div class="item">
<a href="#"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern207.jpg" alt="" width="100" height="90" /></a> <span class="caption">Image Caption</span>
</div>
<div class="item">
<a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/p3.html"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern200.jpg" alt="" width="100" height="90" /></a> <span class="caption">Image Caption</span>
</div>
<div class="item">
<a href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/p4.html"><img src="file:///C|/Users/Tony Gonzalez/Downloads/tavern205.jpg" alt="" width="100" height="90" /></a> <span class="caption">Image Caption</span>
</div>
<div class="clear"></div>
</div>
<div id="copyright">&copy; 3 &amp; out Sports Bar | <a href="http://www.facebook.com/pages/3-Out-Irish-Sports-Tavern/163973656963309"><img src="file:///C|/Users/Tony Gonzalez/Downloads/findusonfacebook.jpg" alt="" width="137" height="25" /></a>| <a href="#">Other</a> | <a href="#">Links</a> | <a href="#">Here</a> </div>
</div>

</div>
<!--
Credits should not be removied
Designed by Roshan, www.ramblingsoul.com
-->
<div id="credit"><a title="Free Css Templates" href="http://www.ramblingsoul.com">3 And Out Sports Site </a> by Tony G Productions | Valid <a href="http://validator.w3.org/check?uri=referer">XHTML 1.0</a> | <a href="http://validator.w3.org/check?uri=referer&quot;">CSS 2.0</a></div>
<!--Credits should not be removied-->
</body>
</html>
pandy
You link to files on your own HD both in IMG tags and in links to other pages. Yeah, I know you run the server off your own machine, but your file system can't be accessed from the web. You must use real URLs, not file:///....

That doesn't mean you need to use full URLs (starting with http://). You can use relative URLs.
http://htmlhelp.com/faq/html/basics.html#relative-url

Also, the files you link to must be inside the document root, i.e. the directory you have configured the server to use for web pages. You can't link to any file on your HD as it looks like you may have done. The server can't serve files outside the document root and that's a good thing for security reasons.
Frederiek
Your files point to local files on your computer, hence the "file:///C... " everywhere. Use relative URL's. See http://htmlhelp.com/faq/html/basics.html#relative-url

Then you have a DOCTYPE which isn't finished, lacking the url to the DTD. See http://hsivonen.iki.fi/doctype/

And you have a HEAD section inside BODY with a LINK to a CSS file. Put that <link...> in the HEAD at the top.

<head><link href="file:///C|/Users/Tony Gonzalez/Downloads/irishbar/imagination/style.css" rel="stylesheet" type="text/css" />
</head>

wdgrmusic

That makes complete sense i really appreciate your info its been helpful thank you

QUOTE(pandy @ Jan 13 2011, 10:38 AM) *

You link to files on your own HD both in IMG tags and in links to other pages. Yeah, I know you run the server off your own machine, but your file system can't be accessed from the web. You must use real URLs, not file:///....

That doesn't mean you need to use full URLs (starting with http://). You can use relative URLs.
http://htmlhelp.com/faq/html/basics.html#relative-url

Also, the files you link to must be inside the document root, i.e. the directory you have configured the server to use for web pages. You can't link to any file on your HD as it looks like you may have done. The server can't serve files outside the document root and that's a good thing for security reasons.

pandy
You are welcome. Good luck. happy.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2014 Invision Power Services, Inc.