CSS left middle right block in a row

Posted on 2006-04-24
Last Modified: 2012-05-05

what i /really/ want is:

|            |             unlimited size (and a long bg image)                   |            |
| left       ---------------------------------------------------------------------  right    |
|            |                                 navbar (text inline)                        |            |

just copy this into notepad to get the idea

but i thought id start off small first, so i try to get a:

<table><tr><td>left</td><td>bla</td><td>right</td></table> using divs

not text only, it will contain images etc so i want div blocks, inline wont do

anyway, i wanted to start off with this: but it aint working, any ideas why?

<style type="text/css" media="screen">

                  margin: 0;
                  padding: 0;
                  font-size: 95%;
                  font-family: georgia, times, "times new roman", serif;
                  color: #000;
                  background-color: #fff;

            a:link { color: #036; }
            a:visited { color: #066; }

            a:hover, a:active
                  color: #fff;
                  background-color: #036;

                  color: #fff;
                  background-color: #333;
                  border-bottom: 1px solid #000;

                  width: 150px;
                  padding-top: 2em;

                  margin-left: 150px;
                  margin-right: 150px;

                  width: 150px;
                  float: right;
                  color: #f00;

<div id="banner">
      <div id="banleft">
      <div id="banmiddle">
      <div id="banright">
            yo jo
Question by:maUru
    LVL 7

    Author Comment

    nevermind i found it

    <div style="clear:both;"></div>
    just before closing banner div

    Accepted Solution

    PAQed with points refunded (50)

    Community Support Moderator

    Featured Post

    Highfive + Dolby Voice = No More Audio Complaints!

    Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

    Join & Write a Comment

    Suggested Solutions

    A colleague recently asked me about how to give his client a small part of the web site that could be completely under the client's control.  Since I have done this sort of thing before to add emergency banners to a web site, I decided I would creat…
    As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
    In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
    In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…

    755 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    22 Experts available now in Live!

    Get 1:1 Help Now