2 Row template problem

  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

The HTML for it is...
HTML Code: [ Select ]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My Site</title>
<link href="Scripts/design.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container">
<div id="top">
<div id="topMem">
<p>Welcome <strong>Guest</strong></p>
</div>
</div>
<div class="spacer"></div><div id="menuContainer">
Navigation<br />
<div class="menuItem">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div>
Navigation<br />
<div class="menuItem">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div>
Navigation<br />
<div class="menuItem">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div>
</div>
<div class="spacer"></div>
<div id="content"><p>This is so annoying. I wish that this thing would start working now.</p>
</div>
<div class="spacer"></div>
<div id="footer">
<p>Copyright &copy; 2008-2009 <a href="#">WD Productions</a></p>
</div>
</div></body>
</html>
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>My Site</title>
  5. <link href="Scripts/design.css" rel="stylesheet" type="text/css">
  6. </head>
  7. <body>
  8. <div id="container">
  9. <div id="top">
  10. <div id="topMem">
  11. <p>Welcome <strong>Guest</strong></p>
  12. </div>
  13. </div>
  14. <div class="spacer"></div><div id="menuContainer">
  15. Navigation<br />
  16. <div class="menuItem">
  17. <a href="#">Link</a>
  18. <a href="#">Link</a>
  19. <a href="#">Link</a>
  20. <a href="#">Link</a>
  21. <a href="#">Link</a>
  22. <a href="#">Link</a>
  23. <a href="#">Link</a>
  24. </div>
  25. Navigation<br />
  26. <div class="menuItem">
  27. <a href="#">Link</a>
  28. <a href="#">Link</a>
  29. <a href="#">Link</a>
  30. <a href="#">Link</a>
  31. <a href="#">Link</a>
  32. <a href="#">Link</a>
  33. <a href="#">Link</a>
  34. </div>
  35. Navigation<br />
  36. <div class="menuItem">
  37. <a href="#">Link</a>
  38. <a href="#">Link</a>
  39. <a href="#">Link</a>
  40. <a href="#">Link</a>
  41. <a href="#">Link</a>
  42. <a href="#">Link</a>
  43. <a href="#">Link</a>
  44. </div>
  45. </div>
  46. <div class="spacer"></div>
  47. <div id="content"><p>This is so annoying. I wish that this thing would start working now.</p>
  48. </div>
  49. <div class="spacer"></div>
  50. <div id="footer">
  51. <p>Copyright &copy; 2008-2009 <a href="#">WD Productions</a></p>
  52. </div>
  53. </div></body>
  54. </html>

And the CSS for it is
CSS Code: [ Select ]
body {
 margin: opx;
}
a img {
 border: 0px;
}
div#container {
 border: 1px solid #000000;
 background-color: #FFFFFF;
 color: #000000;
 width: 900px;
 margin-left: auto;
 margin-right: auto;
}
div#menuContainer {
 background-color: #CECECE;
 color: #000000;
 float: left;
 padding: 0;
 border-right: 1px solid #000000;
 width: 150px;
}
.menuItem {
 background-color: #777777;
 margin-left: 5 5 5 5;
 padding-left: 10px;
}
 
.menuItem a {
 text-decoration: none;
 width: 100%;
 display: block;
 color: #F1EDC2;
}
 
.menuItem a:hover {
 text-decoration: underline;
 width: 100%;
 background-color: #999999;
 color: #FEF0C9;
}
 
.menuItem a:visited {
 text-decoration: none;
 width: 100%;
 color: #FEFFEF;
}
div#top {
 background-color: #444444;
 color: #FFFFFF;
 border-bottom: 1px solid #000000;
}
div#topMem {
 text-align: right;
 padding-right: 5px;
 padding-top: 2px;
}
.spacer {
 clear: both;
 width: 0;
 height: 0;
}
div#footer {
 background-color: #444444;
 color: #FFFFFF;
 margin: 0;
 text-align: center;
 padding-bottom: 2px;
 border-top: 1px solid #000000;
}
div#footer a {
 color: #CECECE;
}
div#footer a:hover {
 color: #CECECE;
 text-decoration: italic;
}
div#content {
 background-color: #FFFFFF;
 color: #000000;
 display: left;
 width: 740px;
}
  1. body {
  2.  margin: opx;
  3. }
  4. a img {
  5.  border: 0px;
  6. }
  7. div#container {
  8.  border: 1px solid #000000;
  9.  background-color: #FFFFFF;
  10.  color: #000000;
  11.  width: 900px;
  12.  margin-left: auto;
  13.  margin-right: auto;
  14. }
  15. div#menuContainer {
  16.  background-color: #CECECE;
  17.  color: #000000;
  18.  float: left;
  19.  padding: 0;
  20.  border-right: 1px solid #000000;
  21.  width: 150px;
  22. }
  23. .menuItem {
  24.  background-color: #777777;
  25.  margin-left: 5 5 5 5;
  26.  padding-left: 10px;
  27. }
  28.  
  29. .menuItem a {
  30.  text-decoration: none;
  31.  width: 100%;
  32.  display: block;
  33.  color: #F1EDC2;
  34. }
  35.  
  36. .menuItem a:hover {
  37.  text-decoration: underline;
  38.  width: 100%;
  39.  background-color: #999999;
  40.  color: #FEF0C9;
  41. }
  42.  
  43. .menuItem a:visited {
  44.  text-decoration: none;
  45.  width: 100%;
  46.  color: #FEFFEF;
  47. }
  48. div#top {
  49.  background-color: #444444;
  50.  color: #FFFFFF;
  51.  border-bottom: 1px solid #000000;
  52. }
  53. div#topMem {
  54.  text-align: right;
  55.  padding-right: 5px;
  56.  padding-top: 2px;
  57. }
  58. .spacer {
  59.  clear: both;
  60.  width: 0;
  61.  height: 0;
  62. }
  63. div#footer {
  64.  background-color: #444444;
  65.  color: #FFFFFF;
  66.  margin: 0;
  67.  text-align: center;
  68.  padding-bottom: 2px;
  69.  border-top: 1px solid #000000;
  70. }
  71. div#footer a {
  72.  color: #CECECE;
  73. }
  74. div#footer a:hover {
  75.  color: #CECECE;
  76.  text-decoration: italic;
  77. }
  78. div#content {
  79.  background-color: #FFFFFF;
  80.  color: #000000;
  81.  display: left;
  82.  width: 740px;
  83. }

The problem with it, is that the content is right under the menu... I really need to put the content to the right of the menu. It doesn't do that although I'm using the same technique that I have used for my other sites, and that worked :x any help? Thanks :P
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

lol ... remove "<div class='spacer'></div>" from below the menu ... that's all ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

God I feel stupid :lol: Thanks
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

All good ... and don't feel stupid ... much worse has happened to most of us ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Alright thanks :)

About your sig... is it supposed to be Legend? Or Legen?
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

no, it's correct the way it is ... you'll see why soon enough ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

alright... ok

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 41 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.