View Full Version : Aligning a logo and menu table at top of page

02-24-2011, 08:26 PM

I'm trying to align a logo and a table together at the top of the page.

The logo at the top left and then the table (which is the menu bar) to the right of it. I have tried using <div> tags around both but the table is to the right under the logo.

<a href="home.html">
<div align="left"><img src="pictures/pages JoHO LOGO.png" alt="Joho Designs Logo" border="0"/></div></a>
<div align="right">
<table width="90%">
<td width="12.5%" align="center"><img src="menu bar/row1sq1_home_OP.png" border="0" alt="home"/></td>
<td width="12.5%" align="center"><img src="menu bar/row1sq3_about_OP.png" border="0" alt="about"/></td>
<td width="12.5%" align="center"><img src="menu bar/row2sq3_cards_OP.png" border="0" alt="cards"/></td>
<td width="12.5%" align="center"><img src="menu bar/row3sq1_illustrations_OP.png" border="0" alt="illustrations"/></td>
<td width="12.5%" align="center"><img src="menu bar/row3sq4_wedding_OP.png" border="0" alt="weddings"/></td>
<td width="12.5%" align="center"><img src="menu bar/row4sq2_portraits_OP.png" border="0" alt="portraits"/></td>
<td width="12.5%" align="center"><img src="menu bar/row4sq3_contact_OP.png" border="0" alt="contact"/></td>


can anyone shed any light? is it some CSS needs to be added?



02-25-2011, 03:00 AM
You are using outdated elements.

Get style sheet and link to it in the head of your browser.
<div class="left">Content</div>
<div class="right">Content</div>

.left { float:left; width: 30%;}
.right {float:right; width: ?}
table {width: 90%; border: 0;}
tr {width: 90%; /* less any padding you put on the table*/}
td {width: 12.50%; border: 0; text-align: center;}

Really you should not be using table for navigation, there are plenty of free scripts for navigation. Try www.cssplay.com

02-25-2011, 05:09 PM
Why not use an unordered list for a menu. Thats basically what a menu is anyway.

Tables, as quartzy said, are not really a good idea for anything other than columnar data and are somewhat limited in how they can be presented and styled.

A good option for someone new is to download the free tool CSS tab designer. Google it. With it you can quickly design horizontal and verticle navigation menus.

02-28-2011, 05:33 PM

I know using Tables is not good, still learning and I find tables easiest!

however am currently converting site to css so thanks for help!!