What's wrong with my coding?

Discussion in 'HTML & Website Design' started by EGS, Jun 24, 2007.

  1. #1
    Can someone tell me what's wrong with my coding? :confused:

    My Pontiac Grand Am site is f'ing up. :(
     
    EGS, Jun 24, 2007 IP
  2. prateek

    prateek Peon

    Messages:
    82
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Umm... wats wrong with that page..
    i mean... cant find any errors.. just that the placing aint right..
    so wat do you want actually ?
     
    prateek, Jun 24, 2007 IP
  3. sundaybrew

    sundaybrew Numerati

    Messages:
    7,294
    Likes Received:
    1,260
    Best Answers:
    0
    Trophy Points:
    560
    #3
    I think this is what you are trying to do


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html lang="en-US">
    <head>
    <title>Pontiac Grand Am Owners Resource</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="description" content="Pontiac Grand Am owners resource site offering performance and appearance modifications advice for optimizing the Pontiac Grand Am." />
    <meta name="keywords" content="grand am, pontiac grand am, grand am performance modifications, grand am appearance modifications, grand am site" />
    <base href="http://www.grandayum.com/" />
    <link href="styles/dark.css" rel="stylesheet" type="text/css" />
    <script src="scripts/links.js" type="text/javascript"></script>
    </head>
    <body>
    <div id="wrapper">
      <div id="header"></div>
      <div id="footing"> 
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="11%" valign="top">Main Menu<br /> <a href="index.html" title="Pontiac Grand Am Owners Resource">Home 
              Page</a><br /> <a href="grand-am-information.html" title="Pontiac Grand Am Information">Grand 
              Am Info</a><br /> <a href="grand-am-videos.html" title="Pontiac Grand Am Videos">Grand 
              Am Vids</a><br /> <a href="grand-am-appearance-modifications.html" title="Pontiac Grand Am Appearance Modifications">Appearance 
              Mods</a><br /> <a href="grand-am-performance-modifications.html" title="Pontiac Grand Am Performance Modifications">Performance 
              Mods</a><br /> <a href="auto-resources-and-car-sites.html" title="Auto Resources and Car Site Listings">Auto 
              Resources</a><br /> <br />
              Appearance Mods<br /> <br />
              <br />
              Performance Mods<br /> <a href="grand-am-62mm-throttle-body.html" title="62mm Throttle Body for the Pontiac Grand Am">62mm 
              Throttle Body</a><br /> <a href="grand-am-cat-back-exhaust-system.html" title="Cat-Back Exhaust Systems for the Pontiac Grand Am">Cat-Back 
              Exhaust</a><br /> <a href="grand-am-cold-air-intake.html" title="Cold Air Intake Systems for the Pontiac Grand Am">Cold 
              Air Intake</a><br /> <a href="grand-am-header-manifold.html" title="Headers and Manifolds for the Pontiac Grand Am">Headers/Manifolds</a><br /> 
              <a href="grand-am-nitrous-kit.html" title="Nitrous Kits for the Pontiac Grand Am">Nitrous 
              Kits</a><br /> <a href="grand-am-pcm.html" title="Programmed Engine Control Unit (PCM) for the Pontiac Grand Am">PCM</a><br /> 
              <a href="grand-am-ram-air-hood.html" title="Ram-Air Hoods for the Pontiac Grand Am">Ram-Air 
              Hoods</a><br /> <a href="grand-am-supercharger.html" title="Superchargers for the Pontiac Grand Am">Superchargers</a></td>
            <td width="80%" valign="top">
    <div align="center">
                <div id="content">
                  <h2>Gran Dayum! A Pontiac <span style="font-style: italic;">Grand 
                    Am</span> resource site.</h2>
                  <p>Welcome to Gran Dayum!, a resource site for those who drive one 
                    of Pontiac's best-selling car: the Grand Am.</p>
                  <p>Gran Dayum! is a Pontiac Grand Am owners resource site offering 
                    performance and appearance modifications advice for optimizing 
                    the Pontiac Grand Am.</p>
                  <div id="imgbox"> <a href="grand-am-pictures/metallicred.jpg" rel="external"><img src="grand-am-pictures/metallicred_thumb.gif" alt="Pontiac Grand Am GT" /></a> 
                    <a href="grand-am-pictures/whitegt.jpg" rel="external"><img src="grand-am-pictures/whitegt_thumb.gif" alt="Pontiac Grand Am GT" /></a> 
                    <a href="grand-am-pictures/red.jpg" rel="external"><img src="grand-am-pictures/red_thumb.gif" alt="Pontiac Grand Am SE" /></a> 
                  </div>
                </div>
                <br class="brclear" />
                <div id="footing"> 
                  <p><a href="http://www.copyscape.com" rel="external" title="Content copyright protected by Copyscape"><img src="http://banners.copyscape.com/images/cs-wh-234x16.gif" alt="Content copyright protected by Copyscape" /></a><br />
                    &copy; 2007 Grandayum!, a <a href="http://www.grandayum.com" title="Pontiac Grand Am Resource">Pontiac 
                    Grand Am resource</a> site. All content is copyright. All images 
                    are copyright to their respective owners. </p>
                </div>
    </div></td>
            <td width="9%" valign="top"><div align="center">
                <script type="text/javascript"><!--
    google_ad_client = "pub-1281952282556547";
    google_ad_width = 120;
    google_ad_height = 600;
    google_ad_format = "120x600_as";
    google_ad_type = "text_image";
    //2007-05-07: Grand Dayum!
    google_ad_channel = "4325710400";
    google_color_border = "666666";
    google_color_bg = "666666";
    google_color_link = "000000";
    google_color_text = "000000";
    google_color_url = "666666";
    //-->
    </script>
                <script type="text/javascript"
      src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script>
              </div></td>
          </tr>
        </table>
        <p>&nbsp;</p>
      </div>
    </div>
    </body>
    
    </html>
    HTML:
     
    sundaybrew, Jun 24, 2007 IP
    CountryBoy likes this.
  4. Smithers

    Smithers Banned

    Messages:
    1,442
    Likes Received:
    29
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Just the placements are wrong and the blue text is hurting my eyes so bad.
     
    Smithers, Jun 24, 2007 IP
  5. mgrohan

    mgrohan Active Member

    Messages:
    671
    Likes Received:
    18
    Best Answers:
    0
    Trophy Points:
    58
    #5
    Keeping it tableless:

    id="menu"
    IN CSS ADD: float:left; width:200px;
    (should float the left column, so the right side goes beside it and not under it)

    id="imgbox"
    IN CSS ADD: clear:both;
    (Will clear above floated column so footer appears under it)
     
    mgrohan, Jun 24, 2007 IP
  6. nwk

    nwk Well-Known Member

    Messages:
    385
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    158
    #6
    This code
    
    <base href="http://www.grandayum.com/" />
    
    Code (markup):
    that you put below the meta tags is the problem. Removing it will solve the problem but the images and links that you provide relative to this base address will not work.. So put full "url" for the images and links.
     
    nwk, Jun 24, 2007 IP
  7. nwk

    nwk Well-Known Member

    Messages:
    385
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    158
    #7
    I got a better solution... You don't need to change the image and link urls.. Just MOVE this code
    <base href="http://www.grandayum.com/" />
    Code (markup):
    below the the link to CSS..Here's the corrected code
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html lang="en-US">
    <head>
    <title>Pontiac Grand Am Owners Resource</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="description" content="Pontiac Grand Am owners resource site offering performance and appearance modifications advice for optimizing the Pontiac Grand Am." />
    <meta name="keywords" content="grand am, pontiac grand am, grand am performance modifications, grand am appearance modifications, grand am site" />
    
    <link  rel="stylesheet" type="text/css" href="styles/dark.css"/>
    <script src="scripts/links.js" type="text/javascript"></script>
    <base href="http://www.grandayum.com/" />
    </head>
    <body>
    <div id="wrapper">
    <div id="header"></div>
    <h1><span style="color: #fe0000;">Pontiac</span> <span style="font-style: italic;">Grand Am</span> Owners Resource</h1>
    
    <div id="menu">
    Main Menu<br />
    <a href="index.html" title="Pontiac Grand Am Owners Resource">Home Page</a><br />
    <a href="grand-am-information.html" title="Pontiac Grand Am Information">Grand Am Info</a><br />
    <a href="grand-am-videos.html" title="Pontiac Grand Am Videos">Grand Am Vids</a><br />
    <a href="grand-am-appearance-modifications.html" title="Pontiac Grand Am Appearance Modifications">Appearance Mods</a><br />
    <a href="grand-am-performance-modifications.html" title="Pontiac Grand Am Performance Modifications">Performance Mods</a><br />
    <a href="auto-resources-and-car-sites.html" title="Auto Resources and Car Site Listings">Auto Resources</a><br />
    <br />
    Appearance Mods<br />
    
    <br /><br />
    Performance Mods<br />
    <a href="grand-am-62mm-throttle-body.html" title="62mm Throttle Body for the Pontiac Grand Am">62mm Throttle Body</a><br />
    <a href="grand-am-cat-back-exhaust-system.html" title="Cat-Back Exhaust Systems for the Pontiac Grand Am">Cat-Back Exhaust</a><br />
    <a href="grand-am-cold-air-intake.html" title="Cold Air Intake Systems for the Pontiac Grand Am">Cold Air Intake</a><br />
    <a href="grand-am-header-manifold.html" title="Headers and Manifolds for the Pontiac Grand Am">Headers/Manifolds</a><br />
    <a href="grand-am-nitrous-kit.html" title="Nitrous Kits for the Pontiac Grand Am">Nitrous Kits</a><br />
    <a href="grand-am-pcm.html" title="Programmed Engine Control Unit (PCM) for the Pontiac Grand Am">PCM</a><br />
    <a href="grand-am-ram-air-hood.html" title="Ram-Air Hoods for the Pontiac Grand Am">Ram-Air Hoods</a><br />
    
    <a href="grand-am-supercharger.html" title="Superchargers for the Pontiac Grand Am">Superchargers</a><br />
    <br />
    <script type="text/javascript"><!--
    google_ad_client = "pub-1281952282556547";
    google_ad_width = 120;
    google_ad_height = 600;
    google_ad_format = "120x600_as";
    google_ad_type = "text_image";
    //2007-05-07: Grand Dayum!
    google_ad_channel = "4325710400";
    google_color_border = "666666";
    google_color_bg = "666666";
    google_color_link = "000000";
    google_color_text = "000000";
    google_color_url = "666666";
    //-->
    </script>
    <script type="text/javascript"
      src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script>
    </div>
    <div id="content">
    <h2>Gran Dayum! A Pontiac <span style="font-style: italic;">Grand Am</span> resource site.</h2>
    <p>Welcome to Gran Dayum!, a resource site for those who drive one of Pontiac's best-selling car: the Grand Am.</p>
    <p>Gran Dayum! is a Pontiac Grand Am owners resource site offering performance and appearance modifications advice for optimizing the Pontiac Grand Am.</p>
    
    <div id="imgbox">
    <a href="grand-am-pictures/metallicred.jpg" rel="external"><img src="grand-am-pictures/metallicred_thumb.gif" alt="Pontiac Grand Am GT" /></a>
    <a href="grand-am-pictures/whitegt.jpg" rel="external"><img src="grand-am-pictures/whitegt_thumb.gif" alt="Pontiac Grand Am GT" /></a>
    <a href="grand-am-pictures/red.jpg" rel="external"><img src="grand-am-pictures/red_thumb.gif" alt="Pontiac Grand Am SE" /></a>
    </div>
    </div>
    <br class="brclear" />
    <div id="footing">
    <a href="http://www.copyscape.com" rel="external" title="Content copyright protected by Copyscape"><img src="http://banners.copyscape.com/images/cs-wh-234x16.gif" alt="Content copyright protected by Copyscape" /></a><br />
    &copy; 2007 Grandayum!, a <a href="http://www.grandayum.com" title="Pontiac Grand Am Resource">Pontiac Grand Am resource</a> site. All content is copyright. All images are copyright to their respective owners.
    </div>
    </div>
    </body>
    
    </html>
    
    Code (markup):
    Cheers:)
     
    nwk, Jun 24, 2007 IP
  8. EGS

    EGS Notable Member

    Messages:
    6,078
    Likes Received:
    438
    Best Answers:
    0
    Trophy Points:
    290
    #8
    Yeah, that made no difference.
     
    EGS, Jun 25, 2007 IP
  9. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #9
    Let's see, your list of menu links is... a list, so use a list... You are prematurely closing the wrapper (I think), your content inside the wrapper appear to have widths on them even when they are the same as the parent (that's a waste)

    Wait, a span to do ITALIC? INLINED?

    One minute, this is gonna take me a bit.
     
    deathshadow, Jun 25, 2007 IP
  10. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #10
    Ok, what gives with the script? They removed target="_blank" for a reason, it's impolite to dictate to the user pages opening in a new window... So what do you do, use a javascript to emulate it.

    **** THUD ****
    (that's my head hitting the wall)
     
    deathshadow, Jun 25, 2007 IP
  11. nwk

    nwk Well-Known Member

    Messages:
    385
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    158
    #11
    You got your problem solved..:)
    How did it work out?
     
    nwk, Jun 25, 2007 IP
  12. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #12
    #wrapper {
    position: relative;
    margin: 0;
    padding: 0;
    width: 95%;
    }

    Set that to your desired 75%, set it's margins to 0px auto, then remove the width declarations where you are saying 75% - at least, I THINK that's what you are trying to do.
     
    deathshadow, Jun 25, 2007 IP