472,782 Members | 3,310 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,782 software developers and data experts.

Having problem with border around html page

I am having a problem with a border around me html page. The border does not flow thru the whole html page, it cuts off halfway.

--> See http://keithborom.com/marlon-sanders

CSS STYLESHEET

Expand|Select|Wrap|Line Numbers
  1.  /* CSS for Marlon Sanders site
  2.  */
  3.  
  4. html, body {
  5. height: 100%;
  6. }
  7.  
  8. #container {
  9. min-height: 100%;
  10. margin-bottom: -330px;
  11. position: relative;
  12. margin: auto;
  13. border: 2px solid black;
  14. width: 800px;
  15. }
  16.  
  17. #footer {
  18. height: 330px;
  19. position: relative;
  20. }
  21.  
  22. #container {
  23. height: 100%;
  24. }
  25.  
  26. body {
  27. font-family: Verdana, Helvetica, Arial, sans-serif;
  28. padding: 20px;
  29. font-size: small;
  30.  
  31. /* for navigation links
  32. */
  33.  
  34. #navigation {
  35. background-color: #CCCC66;
  36. width: 150px;
  37. height: auto;
  38. }
  39.  
  40. a {
  41. font-weight: bold;
  42. }
  43.  
  44. a:link {
  45. color: #0066FF;
  46. }
  47.  
  48. a:visited {
  49. color: #000000;
  50. }
  51.  
  52. a:hover {
  53. text-decoration: none;
  54. color: red;
  55. }
  56.  
  57. a:active {
  58. color: aqua;
  59. }
  60.  
  61. /* for positioning elements on page
  62. */
  63.  
  64. #navigation, #header, #bodycontent {
  65. position: absolute;
  66. }
  67.  
  68. #navigation, #bodycontent {
  69. top: 123px;
  70. }
  71.  
  72. #header {
  73. left: 180px;
  74. }
  75.  
  76. #bodycontent {
  77. left: 180px;
  78. }
  79.  
HTML CODE

Expand|Select|Wrap|Line Numbers
  1. / <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>Marlon Sanders' Product Highlights</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6.  
  7. <style type="text/css">
  8. <!--
  9. @import url("style1.css");
  10. -->
  11. <!--[if lt IE 7]>
  12. <link rel="stylesheet" type="text/css" href="ie6.css" />
  13. <![endif]-->
  14.  
  15. </style>
  16. </head>
  17. <body>
  18. <div id="container">
  19.  
  20. <table width="99%" cellspacing="0" cellpadding="5">
  21.   <tr>
  22.     <td bgcolor="yellow" align="center">Keith&acute;s Marketing Tools
  23.     </td>
  24.   </tr>
  25. </table>
  26.  
  27. <div id="navigation">
  28. <ul>
  29. <li><a href="index.html">Home</a></li>
  30. <li><a href="about.html">About Me</a></li>
  31. <li><a href="contact.html">Contact</a></li>
  32. </ul>
  33. </div><!--end of site navigation-->
  34.  
  35.  
  36. <div id="header">
  37. <h1>Marlon Sanders</h1>
  38. </div><!--end of header div-->
  39.  
  40. <div id="bodycontent">
  41.  
  42. <p><img src="http://keithborom.com/marlon-sanders/images/marlon-sanders.jpg" width="90" height="118" align="left" alt="marlon sanders picture" /><strong>Marlon Sanders</strong> is a prolific internet marketer, with a dozen internet marketing products and services to his name. He uses his Master's degree in psychology to great effect by writing great ad copy.</p>
  43.  
  44. <p>Marlon&acute;s products and services include The Amazing Formula That Sells Products Like Crazy, Push Button Sales Letters, Associate Program Marketing Handbook, Gimme My Money Now, Amazing Ad Copy Secrets Revealed, Create Your Own Products In A Flash, How to Automate Your Web Business, The Web Site Power System, Web Business Operations Manual, Secrets of Speed Publicity, The Cash Like Clockwork System, Daily Stats Software, and The Ultimate Beginner&acute;s Guide.</p>
  45.     <br />
  46.           <p><strong>Screenshot Description</strong></p>
  47.                     <img src="http://keithborom.com/marlon-sanders/images/amazing-formula.gif" alt="amazing-formula picture" />
  48.                                                 <p><strong>The Amazing Formula That Sells Products Like Crazy</strong>, designed by Marlon Sanders, tells you how to market and sell product and services online</p>
  49.  
  50.           <table width="475" border="1" cellspacing="0" cellpadding="3">
  51.   <tr>
  52.     <th width="157" scope="col">Format</th>
  53.     <th width="157" scope="col">Free Trial</th>
  54.     <th width="157" scope="col">Cost</th>
  55.   </tr>
  56.   <tr>
  57.     <td>CD-Rom</td>
  58.     <td>Sorry</td>
  59.     <td>$79+S&amp;H</td>
  60.   </tr>
  61.   <tr>
  62.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=6">The Amazing Formula That SellsProducts Like Crazy</a></strong></td>
  63.   </tr>
  64. </table>
  65.  
  66.  
  67.  
  68.           <p><strong>Screenshot Description</strong></p>
  69.  
  70.           <p><img src="http://keithborom.com/marlon-sanders/images/gimme-my-money.gif" alt="gimme-my-money picture"/></p>
  71.           <p><strong>Gimme My Money Now!</strong>, designed by Marlon Sanders, teaches you how to really rake it in with crazy little two page web sites that you can create in a flash and host for pocket change!</p>
  72.  
  73.           <table width="475" border="1" cellspacing="0" cellpadding="3">
  74.   <tr>
  75.     <th width="157" scope="col">Format</th>
  76.     <th width="157" scope="col">Pages</th>
  77.     <th width="157" scope="col">Cost</th>
  78.   </tr>
  79.   <tr>
  80.     <td>CD-Rom + Printed Manual    </td>
  81.     <td>139</td>
  82.     <td>$299+S&amp;H</td>
  83.   </tr>
  84.   <tr>
  85.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=8">Gimme My Money Now</a></strong></td>
  86.   </tr>
  87. </table>
  88.  
  89. <p><strong>Product Description</strong></p>
  90.  
  91.          <p><img src="http://keithborom.com/marlon-sanders/images/push-button-letters.gif" alt="push button letters picture"/></p>
  92.          <p><strong>Push Button Letters Software</strong>, designed by Marlon Sanders, is a Sales Message Generation Software
  93. Finally, a product that compels you to be systematic and efficient.  The Sales Message Generation Software  forces one to be not only an organized writer, but also an orderly thinker, which  is a must in communicating copy effectively.</p>
  94.  
  95. <table width="475" border="1" cellspacing="0" cellpadding="3">
  96.   <tr>
  97.     <th width="157" scope="col">Format</th>
  98.     <th width="157" scope="col">Free Trial</th>
  99.     <th width="157" scope="col">Cost</th>
  100.   </tr>
  101.   <tr>
  102.     <td>Web-Based Application    </td>
  103.     <td>Sorry</td>
  104.     <td>$100+S&amp;H</td>
  105.   </tr>
  106.   <tr>
  107.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=7">Push Button Letters Software</a></strong></td>
  108.   </tr>
  109. </table>
  110.  
  111.  
  112.           <p><strong>Screenshot Description</strong></p>
  113.           <img src="http://keithborom.com/marlon-sanders/images/automation-secrets.gif" alt="automation secrets picture" width="140" height="140" />
  114.           <p><strong>Automated Secrets</strong>, designed by Marlon Sansers, 
  115.            is an end-to-end tutorial of active marketing techniques with an easy and painless walkthrough of the all the steps you need to know to automate your web business. </p>
  116.  
  117.            <table width="475" border="1" cellspacing="0" cellpadding="3">
  118.   <tr>
  119.     <th width="157" scope="col">Format</th>
  120.     <th width="157" scope="col">Free Trial</th>
  121.     <th width="157" scope="col">Cost</th>
  122.   </tr>
  123.   <tr>
  124.     <td>CD-Rom + Secrets</td>
  125.     <td>Sorry</td>
  126.     <td>$134.95+S&amp;H</td>
  127.   </tr>
  128.   <tr>
  129.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=12">Automated Secrets</a></strong></td>
  130.   </tr>
  131. </table>
  132.  
  133.           <p><strong>Screenshot Description</strong></p>
  134.           <img src="/marlon-sanders/adcopy1.gif" alt="adcopy1 secrets picture" width="80" height="80" />
  135.           <p><strong>Automated Secrets</strong>, designed by Marlon Sansers, 
  136.            is a slam dunk education in creating killer ad copy that reall works. It's a real eye opener for many people.</p>
  137.  
  138. <p>It walks you through a step-by-step formula. You will see now that many people have copied my formula in their products. That's the truth. </p>
  139.  
  140.            <table width="475" border="1" cellspacing="0" cellpadding="3">
  141.   <tr>
  142.     <th width="157" scope="col">Format</th>
  143.     <th width="157" scope="col">Free Trial</th>
  144.     <th width="157" scope="col">Cost</th>
  145.   </tr>
  146.   <tr>
  147.     <td>CD-Rom</td>
  148.     <td>Sorry</td>
  149.     <td>$203.95+S&amp;H</td>
  150.   </tr>
  151.   <tr>
  152.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=24">Amazing Ad Copy Secrets</a></strong></td>
  153.   </tr>
  154. </table>
  155. <div class="clearfooter"></div>
  156. <!--end of container div-->
  157.  
  158. <div class="footer">
  159. <p>Copyright (c) 2008 Borom, Inc. All Rights Reserved</p></td>
  160. </div><!--end of footer div-->
  161.  
  162.  
  163. <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
  164. </script>
  165. <script type="text/javascript">
  166. _uacct = "UA-3931747-5";
  167. urchinTracker();
  168. </script>
  169. </div>
  170. </body>
  171. </html>
  172.  
Any help is appreciated. I've been trying several things but no success yet.

Thanks
Apr 2 '08 #1
5 2379
eWish
971 Expert 512MB
I would suggest you validate your code both CSS and HTML. Then go from there.

--Kevin
Apr 2 '08 #2
I would suggest you validate your code both CSS and HTML. Then go from there.

--Kevin
I had my site validated css and html. found error in index.html so here is the rework

Expand|Select|Wrap|Line Numbers
  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>Marlon Sanders' Product Highlights</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6.  
  7. <style type="text/css">
  8. <!--
  9. @import url("style1.css");
  10. -->
  11. <!--[if lt IE 7]>
  12. <link rel="stylesheet" type="text/css" href="ie6.css" />
  13. <![endif]-->
  14.  
  15. </style>
  16. </head>
  17. <body>
  18. <div id="container">
  19.  
  20. <table width="99%" cellspacing="0" cellpadding="5">
  21.   <tr>
  22.     <td bgcolor="yellow" align="center">Keith&acute;s Marketing Tools
  23.     </td>
  24.   </tr>
  25. </table>
  26.  
  27. <div id="navigation">
  28. <ul>
  29. <li><a href="index.html">Home</a></li>
  30. <li><a href="about.html">About Me</a></li>
  31. <li><a href="contact.html">Contact</a></li>
  32. </ul>
  33. </div><!--end of site navigation-->
  34.  
  35.  
  36. <div id="header">
  37. <h1>Marlon Sanders</h1>
  38. </div><!--end of header div-->
  39.  
  40. <div id="bodycontent">
  41.  
  42. <p><img src="http://keithborom.com/marlon-sanders/images/marlon-sanders.jpg" width="90" height="118" align="left" alt="marlon sanders picture" /><strong>Marlon Sanders</strong> is a prolific internet marketer, with a dozen internet marketing products and services to his name. He uses his Master's degree in psychology to great effect by writing great ad copy.</p>
  43.  
  44. <p>Marlon&acute;s products and services include The Amazing Formula That Sells Products Like Crazy, Push Button Sales Letters, Associate Program Marketing Handbook, Gimme My Money Now, Amazing Ad Copy Secrets Revealed, Create Your Own Products In A Flash, How to Automate Your Web Business, The Web Site Power System, Web Business Operations Manual, Secrets of Speed Publicity, The Cash Like Clockwork System, Daily Stats Software, and The Ultimate Beginner&acute;s Guide.</p>
  45.     <br />
  46.           <p><strong>Screenshot Description</strong></p>
  47.                     <img src="http://keithborom.com/marlon-sanders/images/amazing-formula.gif" alt="amazing-formula picture" />
  48.                                                 <p><strong>The Amazing Formula That Sells Products Like Crazy</strong>, designed by Marlon Sanders, tells you how to market and sell product and services online</p>
  49.  
  50.           <table width="475" border="1" cellspacing="0" cellpadding="3">
  51.   <tr>
  52.     <th width="157" scope="col">Format</th>
  53.     <th width="157" scope="col">Free Trial</th>
  54.     <th width="157" scope="col">Cost</th>
  55.   </tr>
  56.   <tr>
  57.     <td>CD-Rom</td>
  58.     <td>Sorry</td>
  59.     <td>$79+S&amp;H</td>
  60.   </tr>
  61.   <tr>
  62.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=6">The Amazing Formula That SellsProducts Like Crazy</a></strong></td>
  63.   </tr>
  64. </table>
  65.  
  66.  
  67.  
  68.           <p><strong>Screenshot Description</strong></p>
  69.  
  70.           <p><img src="http://keithborom.com/marlon-sanders/images/gimme-my-money.gif" alt="gimme-my-money picture"/></p>
  71.           <p><strong>Gimme My Money Now!</strong>, designed by Marlon Sanders, teaches you how to really rake it in with crazy little two page web sites that you can create in a flash and host for pocket change!</p>
  72.  
  73.           <table width="475" border="1" cellspacing="0" cellpadding="3">
  74.   <tr>
  75.     <th width="157" scope="col">Format</th>
  76.     <th width="157" scope="col">Pages</th>
  77.     <th width="157" scope="col">Cost</th>
  78.   </tr>
  79.   <tr>
  80.     <td>CD-Rom + Printed Manual    </td>
  81.     <td>139</td>
  82.     <td>$299+S&amp;H</td>
  83.   </tr>
  84.   <tr>
  85.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=8">Gimme My Money Now</a></strong></td>
  86.   </tr>
  87. </table>
  88.  
  89. <p><strong>Product Description</strong></p>
  90.  
  91.          <p><img src="http://keithborom.com/marlon-sanders/images/push-button-letters.gif" alt="push button letters picture"/></p>
  92.          <p><strong>Push Button Letters Software</strong>, designed by Marlon Sanders, is a Sales Message Generation Software
  93. Finally, a product that compels you to be systematic and efficient.  The Sales Message Generation Software  forces one to be not only an organized writer, but also an orderly thinker, which  is a must in communicating copy effectively.</p>
  94.  
  95. <table width="475" border="1" cellspacing="0" cellpadding="3">
  96.   <tr>
  97.     <th width="157" scope="col">Format</th>
  98.     <th width="157" scope="col">Free Trial</th>
  99.     <th width="157" scope="col">Cost</th>
  100.   </tr>
  101.   <tr>
  102.     <td>Web-Based Application    </td>
  103.     <td>Sorry</td>
  104.     <td>$100+S&amp;H</td>
  105.   </tr>
  106.   <tr>
  107.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=7">Push Button Letters Software</a></strong></td>
  108.   </tr>
  109. </table>
  110.  
  111.  
  112.           <p><strong>Screenshot Description</strong></p>
  113.           <img src="http://keithborom.com/marlon-sanders/images/automation-secrets.gif" alt="automation secrets picture" width="140" height="140" />
  114.           <p><strong>Automated Secrets</strong>, designed by Marlon Sansers, 
  115.            is an end-to-end tutorial of active marketing techniques with an easy and painless walkthrough of the all the steps you need to know to automate your web business. </p>
  116.  
  117.            <table width="475" border="1" cellspacing="0" cellpadding="3">
  118.   <tr>
  119.     <th width="157" scope="col">Format</th>
  120.     <th width="157" scope="col">Free Trial</th>
  121.     <th width="157" scope="col">Cost</th>
  122.   </tr>
  123.   <tr>
  124.     <td>CD-Rom + Secrets</td>
  125.     <td>Sorry</td>
  126.     <td>$134.95+S&amp;H</td>
  127.   </tr>
  128.   <tr>
  129.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=12">Automated Secrets</a></strong></td>
  130.   </tr>
  131. </table>
  132.  
  133.           <p><strong>Screenshot Description</strong></p>
  134.           <img src="/marlon-sanders/adcopy1.gif" alt="adcopy1 secrets picture" width="80" height="80" />
  135.           <p><strong>Automated Secrets</strong>, designed by Marlon Sansers, 
  136.            is a slam dunk education in creating killer ad copy that reall works. It's a real eye opener for many people.</p>
  137.  
  138. <p>It walks you through a step-by-step formula. You will see now that many people have copied my formula in their products. That's the truth. </p>
  139.  
  140.            <table width="475" border="1" cellspacing="0" cellpadding="3">
  141.   <tr>
  142.     <th width="157" scope="col">Format</th>
  143.     <th width="157" scope="col">Free Trial</th>
  144.     <th width="157" scope="col">Cost</th>
  145.   </tr>
  146.   <tr>
  147.     <td>CD-Rom</td>
  148.     <td>Sorry</td>
  149.     <td>$203.95+S&amp;H</td>
  150.   </tr>
  151.   <tr>
  152.     <td colspan="3" align="right">Visit<strong><a href="http://keithborom.com/link.php?id=24">Amazing Ad Copy Secrets</a></strong></td>
  153.   </tr>
  154. </table>
  155.  
  156. <div class="footer">
  157. <p>Copyright (c) 2008 Borom, Inc. All Rights Reserved</p>
  158. </div><!--end of footer div-->
  159. </div><!--end of bodycontent div-->
  160. </div><!--end of container div-->
  161.  
  162.  
  163. <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
  164. </script>
  165. <script type="text/javascript">
  166. _uacct = "UA-3931747-5";
  167. urchinTracker();
  168. </script>
  169. </body>
  170. </html>
  171.  
I still have the border running thru the middle of my page instead of flowing all the way to the bottom of the page.

--> see http://keithborom.com/marlon-sanders
Apr 2 '08 #3
drhowarddrfine
7,435 Expert 4TB
Busy day for me today.

See if the elements this border is to contain are floated or absolutely positioned. Parent elements will not expand to contain these elements.
Apr 2 '08 #4
My container, which I believe is parent to my navigation, header, and bodycontent, shows relative positioning.

My navigation, header, and bodycontent were positioned on my page using absolute position and then moving elements around.

Tried a few things still without success.

Thanks
Apr 3 '08 #5
drhowarddrfine
7,435 Expert 4TB
Absolutely positioned elements are removed from the normal flow of a page but positioned relative to its relatively positioned element. However, to the parent element, the child does not exist.
Apr 3 '08 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

3
by: John Draper | last post by:
I am having a lot of problems trying to get a Python CGI to run. I have included 3 parts... 1) A simple stripped down python module. 2) An output of what I get when I do: python index.py...
2
by: deko | last post by:
I use variables in some links on my page. I need to send these variables so I can change the color of the links in the navbar when the user is on that page. If you click around on the site you...
23
by: Bob Bedford | last post by:
I've a table. The table must not have any border. The TR (every line) must have a border, but not the lines between cells. The TR.pages must have no border. so .mytable{border:0px;} ...
3
by: Robert Dell | last post by:
I have a problem comparing strings in an order form i'm writing. I want to give a running total at the bottom of the page and it appears to be working except it doesn't compare correctly (it...
1
by: Keith Smith | last post by:
When I use this code.... window.open('gallery/pic1.jpg','windowname','width=775,height=550,resizable=yes,scrollbars=yes,top=10,left=10'); ....my web page displays a picture with a white border...
2
by: Goober | last post by:
I have the following default.aspx page that works properly. However, what I want to do is to link the graphics within it (that are hard coded now in the default web page) to our corporate...
2
by: tradmusic.com | last post by:
Hi, I'm new to CSS and, following some advice, created my page like this: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head>...
0
Screaming Eagle
by: Screaming Eagle | last post by:
Ok, so some associates and I are building a website, and I'm in charge of the design and layout. I've decided to go with a simple navigation bar on top contained in its own div. Under the navigation...
5
matheussousuke
by: matheussousuke | last post by:
Hello, I'm using tiny MCE plugin on my oscommerce and it is inserting my website URL when I use insert image function in the emails. The goal is: Make it send the email with the URL...
0
by: erikbower65 | last post by:
Using CodiumAI's pr-agent is simple and powerful. Follow these steps: 1. Install CodiumAI CLI: Ensure Node.js is installed, then run 'npm install -g codiumai' in the terminal. 2. Connect to...
0
by: erikbower65 | last post by:
Here's a concise step-by-step guide for manually installing IntelliJ IDEA: 1. Download: Visit the official JetBrains website and download the IntelliJ IDEA Community or Ultimate edition based on...
0
by: kcodez | last post by:
As a H5 game development enthusiast, I recently wrote a very interesting little game - Toy Claw ((http://claw.kjeek.com/))。Here I will summarize and share the development experience here, and hope it...
14
DJRhino1175
by: DJRhino1175 | last post by:
When I run this code I get an error, its Run-time error# 424 Object required...This is my first attempt at doing something like this. I test the entire code and it worked until I added this - If...
0
by: Rina0 | last post by:
I am looking for a Python code to find the longest common subsequence of two strings. I found this blog post that describes the length of longest common subsequence problem and provides a solution in...
0
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
0
by: lllomh | last post by:
How does React native implement an English player?
0
by: Mushico | last post by:
How to calculate date of retirement from date of birth
2
by: DJRhino | last post by:
Was curious if anyone else was having this same issue or not.... I was just Up/Down graded to windows 11 and now my access combo boxes are not acting right. With win 10 I could start typing...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.