Got an idea but no idea where to start. (html/css)

[Deleted User 234324]

Been working a site recently thats primarily made up using tables (not my choice, just offered a hand in sorting it out).

Basically im looking to redesign several of the main parts for the site in CSS with a general aim of reducing or removing the need to use tables at all.

The problem is I have no idea where to start and how I would actually go about getting it done.

My basic plan is to have a header that looks like this:



As you can see, the idea is the menu bar at the top would be a rollover menu created using css, the main company logo would I guess be a background image of some sort, the smaller logo/url would be an image also but i assume would need to be positioned using css (no idea how to do it).

finally the bottom menu would be a tabbed type rollover menu which im fairly confident i can do myself.

My only major problem is the positioning and how it would fit togeather, specially the upper menu and the logo's.

Any input would save me hours and hours of banging my head against a wall.

 

[Tripnologist]

I would do it something like this..

<div id="header">
  <div id="topNav"></div> (float this right)
  <div id="logoContainer"> (apply companylogo image as background and set to no-repeat)
    <div id="otherLogo"><img src="#" alt="" /></div>(position this div with margins to overlap the companylogo)
  </div><!-- end of logoContainer -->
</div><!-- end of header -->

I suffer from divitis though.