Menu Extra Space, Menu Help for Extra Space Options

[richnlp]

Hi, I've installed a menu at the top of this site. The menu has a grey space after the contact button. How can I get rid of the grey space so it's blue there like the area around it? Thanks!

This post has been edited by richnlp: Aug 23 2012, 11:04 PM

[pandy]

It's the background color of body. It shouldn't be hard to fix, but your table is broken and when I try to mend it your layout breaks (it already does that in some browsers).

CODE

  <TABLE width="1100" BORDER="0" align="center" CELLPADDING="0" CELLSPACING="0">
    <TR><!-- Start css3menu.com BODY section -->
<ul id="css3menu1" class="topmenu">
    <li class="topfirst"><a class="pressed" href="index.html" style="height:18px;line-height:18px;">Home</a></li>
    <li class="topmenu"><a href="about.html" style="height:18px;line-height:18px;">About Us</a></li>
    <li class="topmenu"><a href="services.html" style="height:18px;line-height:18px;">Services</a></li>
    <li class="topmenu"><a href="dos.html" style="height:18px;line-height:18px;">Do's and Dont's</a></li>
    <li class="topmenu"><a href="testimonials.html" style="height:18px;line-height:18px;">Testimonials</a></li>
    <li class="topmenu"><a href="water-damage.html" style="height:18px;line-height:18px;">Water Damage Restoration</a></li>
    <li class="toplast"><a href="contact.html" style="height:18px;line-height:18px;">Contact Us</a></li>
</ul><p class="_css3m"><a href="http://css3menu.com/">Free Vertical CSS Menus Css3Menu.com</a></p>
<!-- End css3menu.com BODY section -->
      <TD COLSPAN="16"><IMG SRC="layout/layout/layout_1.jpg" alt="carpet and rug cleaning dallas" WIDTH="1100" BORDER="0" HEIGHT="164"></TD>

You can't have the UL directly in TR. It must be in a TD.

More...
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

[richnlp]

It's the background color of body. It shouldn't be hard to fix, but your table is broken and when I try to mend it your layout breaks (it already does that in some browsers).

CODE

  <TABLE width="1100" BORDER="0" align="center" CELLPADDING="0" CELLSPACING="0">
    <TR><!-- Start css3menu.com BODY section -->
<ul id="css3menu1" class="topmenu">
    <li class="topfirst"><a class="pressed" href="index.html" style="height:18px;line-height:18px;">Home</a></li>
    <li class="topmenu"><a href="about.html" style="height:18px;line-height:18px;">About Us</a></li>
    <li class="topmenu"><a href="services.html" style="height:18px;line-height:18px;">Services</a></li>
    <li class="topmenu"><a href="dos.html" style="height:18px;line-height:18px;">Do's and Dont's</a></li>
    <li class="topmenu"><a href="testimonials.html" style="height:18px;line-height:18px;">Testimonials</a></li>
    <li class="topmenu"><a href="water-damage.html" style="height:18px;line-height:18px;">Water Damage Restoration</a></li>
    <li class="toplast"><a href="contact.html" style="height:18px;line-height:18px;">Contact Us</a></li>
</ul><p class="_css3m"><a href="http://css3menu.com/">Free Vertical CSS Menus Css3Menu.com</a></p>
<!-- End css3menu.com BODY section -->
      <TD COLSPAN="16"><IMG SRC="layout/layout/layout_1.jpg" alt="carpet and rug cleaning dallas" WIDTH="1100" BORDER="0" HEIGHT="164"></TD>

You can't have the UL directly in TR. It must be in a TD.

More...
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

So the code should look like this:

CODE

<TABLE width="1100" BORDER="0" align="center" CELLPADDING="0" CELLSPACING="0">
    <TR><!-- Start css3menu.com BODY section -->
<td><ul id="css3menu1" class="topmenu">
    <li class="topfirst"><a class="pressed" href="index.html" style="height:18px;line-height:18px;">Home</a></li>
    <li class="topmenu"><a href="about.html" style="height:18px;line-height:18px;">About Us</a></li>
    <li class="topmenu"><a href="services.html" style="height:18px;line-height:18px;">Services</a></li>
    <li class="topmenu"><a href="dos.html" style="height:18px;line-height:18px;">Do's and Dont's</a></li>
    <li class="topmenu"><a href="testimonials.html" style="height:18px;line-height:18px;">Testimonials</a></li>
    <li class="topmenu"><a href="water-damage.html" style="height:18px;line-height:18px;">Water Damage Restoration</a></li>
    <li class="toplast"><a href="contact.html" style="height:18px;line-height:18px;">Contact Us</a></li>
</ul></td><p class="_css3m"><a href="http://css3menu.com/">Free Vertical CSS Menus Css3Menu.com</a></p>
<!-- End css3menu.com BODY section -->
      <TD COLSPAN="16"><IMG SRC="layout/layout/layout_1.jpg" alt="carpet and rug cleaning dallas" WIDTH="1100" BORDER="0" HEIGHT="164"></TD>

Also if I change the background color for that area, would it change the background color for the whole page?
Thanks for the help.


1 more question: Do you know where I can enter my code on the page so that just the blue background shows up by menu instead of the grey?

This post has been edited by richnlp: Aug 24 2012, 04:15 PM

[pandy]

Now you have this between two TDs.

CODE

<p class="_css3m"><a href="http://css3menu.com/">Free Vertical CSS Menus Css3Menu.com</a></p>

Tables are tight structures. They are made up of a skeleton of (at least) TABLE, TR and TD. Nothing can go between the elements that makes the table and you can't leave any of them out. It's like a thermos bottle that consists of several layers, bottles within bottles. All layers need to be there for the thermos to work and all the coffee must go in the innermost bottle, just as all content (text, images and other HTML) must go in the TDs (or THs if you have them). The table elements, together, create the outer shell. Between them is vacuum - nothing.

[Dr Z]

Now you have this between two TDs.

CODE

<p class="_css3m"><a href="http://css3menu.com/">Free Vertical CSS Menus Css3Menu.com</a></p>

Tables are tight structures. They are made up of a skeleton of (at least) TABLE, TR and TD. Nothing can go between the elements that makes the table and you can't leave any of them out. It's like a thermos bottle that consists of several layers, bottles within bottles. All layers need to be there for the thermos to work and all the coffee must go in the innermost bottle, just as all content (text, images and other HTML) must go in the TDs (or THs if you have them). The table elements, together, create the outer shell. Between them is vacuum - nothing.

Excellent explanation!!!!!!

[pandy]

Thank you. Don't know if it helps. Different people visualize different ways. That's how my brain works.

[richnlp]

Thank you. Don't know if it helps. Different people visualize different ways. That's how my brain works.

Lol I'm glad Dr. Z gets it but I'm not sure that answers my questions:

1. If I change the background color for that area, would it change the background color for the whole page?

2. Do you know where I can enter my code on the page so that just the blue background shows up by menu instead of the grey?

Are you able to write the code correctly so I can visualize it, literally?
Thanks for the help guys, I'm sure I'll get it eventually lol. I don't know why I have such trouble with menus.

Might this be the right code:

CODE

<TABLE width="1100" BORDER="0" align="center" CELLPADDING="0" CELLSPACING="0">
    <TR><!-- Start css3menu.com BODY section -->
<td><ul id="css3menu1" class="topmenu">
    <li class="topfirst"><a class="pressed" href="index.html" style="height:18px;line-height:18px;">Home</a></li>
    <li class="topmenu"><a href="about.html" style="height:18px;line-height:18px;">About Us</a></li>
    <li class="topmenu"><a href="services.html" style="height:18px;line-height:18px;">Services</a></li>
    <li class="topmenu"><a href="dos.html" style="height:18px;line-height:18px;">Do's and Dont's</a></li>
    <li class="topmenu"><a href="testimonials.html" style="height:18px;line-height:18px;">Testimonials</a></li>
    <li class="topmenu"><a href="water-damage.html" style="height:18px;line-height:18px;">Water Damage Restoration</a></li>
    <li class="toplast"><a href="contact.html" style="height:18px;line-height:18px;">Contact Us</a></li>
</ul></td>
<!-- End css3menu.com BODY section -->
      <TD COLSPAN="16"><IMG SRC="layout/layout/layout_1.jpg" alt="carpet and rug cleaning dallas" WIDTH="1100" BORDER="0" HEIGHT="164"></TD>

I deleted the code that was between the TD. I believe it was just a link to the program I used to create the menu.
P.S. Cool avatars guys!

This post has been edited by richnlp: Aug 28 2012, 02:16 AM

[pandy]

Yeah, now the list is in a TD as it should. If I don't know if it displays as you want with the list in the same row as the image, I doubt.

The online page isn't updated with the changes and it looks different in every browser I try, the menu is in different places, so I'm not sure what area you want to be blue. But try UL or the TD it's in.