I need some html help

Ð88 · 03-25-2009, 07:10 PM

I recently started a website and I'm a newb at it so naturally I've run into a problem I can't find a fix for.

I created a bunch of image slices and arranged them in a table. Everything looked perfect until I changed the images to hyperlinks. Now the menu bar is separated by spaces and I don't know how to get rid of them.

Here is page http://www.sterbestunde.com where you can look at the source code.

I want to put it back to the way it was with no spaces in between

Daeva · 03-25-2009, 07:33 PM

I made a couple of changes to the page (to try to make it display in a similar fashion in all browsers. Cheifly, the biggest change I made was to the height and width of the image links. It's best to allow the table to auto-fit to the content. This should be the only major change to fix your problem (I used to hate when tables did this to me!!!).

Here is the updated code listing I did

Code:

<?xml version="1.0" encoding="utf-8"?>
<!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" xml:lang="en-us" dir="ltr" lang="en-us">
 <head>
  <title>Sterbestunde</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="Keywords" content="sterbestunde" />
  <style type="text/css">
   BODY
   {
     background-color: #000000;
     color: #bababa;
   }
   A
   {
     color: #000000;
   }
   A:VISITED
   {
     color: #000000;
   }
   A:ACTIVE
   {
     color: #000000;
   }
   A IMG
   {
     border-width: 0px;
     padding: 0px;
   }
   TD
   {
     padding: 0px;
     margin: 0px;
   }
   #Table_01
   {
     height: 351px;
     width: auto;
     margin: 0px auto;
   }
  </style>
 </head>
 <body>
<!-- ImageReady Slices (header.psd) -->
  <table id="Table_01" border="0" cellpadding="0" cellspacing="0" align="center">
   <thead>
    <tr>
      <td colspan="5" valign="middle" align="center">
       <a href="#" target="_self"><img src="/picture_library/logo.gif" height="308" alt="" border="0" /></a>
      </td>
    </tr>
   </thead>
   <tbody>
    <tr>
      <td colspan="1" valign="middle" align="center">
       <a href="about.html"><img src="/picture_library/about.gif" alt="About" border="0" /></a>
      </td>
      <td colspan="1" valign="middle" align="center">
       <a href="drawings.html"><img src="/picture_library/drawings.gif" alt="Drawings" border="0" /></a>
      </td>
      <td colspan="1" valign="middle" align="center">
       <a href="music.html"><img src="/picture_library/music.gif" alt="Music" border="0" /></a>
      </td>
      <td colspan="1" valign="middle" align="center">
       <a href="adventures.html"><img src="/picture_library/adventures.gif" alt="Adventures" border="0" /></a>
      </td>
      <td colspan="1" valign="middle" align="center">
       <a href="random.html"><img src="/picture_library/random.gif" alt="Random" border="0" /></a>
      </td>
    </tr>
   </tbody>
  </table>
  <h1>Random</h1>
  <br />
 </body>
</html>

Also, the head tag in your source is not closed. That can also create problems.
Hope that helps.

Like the graphic btw

*EDIT: Also I'm pretty sure it will validate (although I didn't check it to make sure), because some of your attributes are deprecated (if you're using the xhtml doctype), but making the site valid right off the bat is a sure-fire way to eliminate a lot of headaches when trying to get the site to look a certain way (especially accross multiple browsers and platforms). If you're not familiar with it, it's a great tool to help your web-design: W3 HTML Validator.

Ð88 · 03-25-2009, 08:19 PM

Wow thank you so much! You definitely seem to know what you're doing. Everything looks great now.

And thank you for that HTML validator. I understand that certain attributes are deprecated and that will definitely be useful for me in the future.

03-25-2009, 07:10 PM	#1
Ð88 Fully Optimized Join Date: May 2005 Posts: 4,786	I need some html help I recently started a website and I'm a newb at it so naturally I've run into a problem I can't find a fix for. I created a bunch of image slices and arranged them in a table. Everything looked perfect until I changed the images to hyperlinks. Now the menu bar is separated by spaces and I don't know how to get rid of them. Here is page http://www.sterbestunde.com where you can look at the source code. I want to put it back to the way it was with no spaces in between __________________ Killing under the cloak of war is no different than murder Kein Alkohol ist auch keine Lösung!

03-25-2009, 08:19 PM	#3
Ð88 Fully Optimized Join Date: May 2005 Posts: 4,786	Re: I need some html help Wow thank you so much! You definitely seem to know what you're doing. Everything looks great now. And thank you for that HTML validator. I understand that certain attributes are deprecated and that will definitely be useful for me in the future. __________________ Killing under the cloak of war is no different than murder Kein Alkohol ist auch keine Lösung!

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode