# I can't figure out my layout

**URL:** https://forum.kirupa.com/t/i-cant-figure-out-my-layout/270045
**Category:** web dev
**Created:** [September 4, 2008, 4:53pm UTC](https://forum.kirupa.com/t/i-cant-figure-out-my-layout/270045 "2008-09-04T16:53:02Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Wes\_Ide](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/wes_ide/32/1119_2.png) [@Wes\_Ide](https://forum.kirupa.com/u/Wes_Ide)
#### Post date: [September 4, 2008, 4:53pm UTC](https://forum.kirupa.com/t/i-cant-figure-out-my-layout/270045/1 "2008-09-04T16:53:02Z")

</div>

I’ve been trying to create a patriotic CSS template. I took one I used before, Dark Ritual, and started modifying it using assets I’d found on the web, as well as colors, etc.

[Here](http://www.wspentertainment.com/patriot/example01.html) is what I’ve got so far.

The problem I am encountering is that I have an image being used in the main middle column (called .main in [the CSS. It can be found [URL=“http://wspentertainment.com/patriot/img/light\_blue.jpg”]here](http://wspentertainment.com/patriot/css/patriot1.css).

Unfortunately, the sections of the site under the navmenu and under the Related Links/Other Stuff column contrast to the middle column.

So then I tried to apply the same image in CSS to these sections. What I did was create a new XHTML document, create the container div just like in the example above, then laid each element into the container div just like in the example above. However, I put the navbar, main, and leftmenu (called main\_right) into its own div, which I called content. I figured I could just make the background image of the content div be the aforemention background image.

```auto
<div class="container">
  <div class="header"></div>
  <div class="content">
    <div class="navbar"></div>
    <div class="main"></div>
    <div class="main_right"></div>
  </div>
  <div class="footer"></div>
</div>

```

However, [this happened instead](http://wspentertainment.com/patriot/example02.html). No idea why.

Would anyone be so kind as to explore my source code from the links provided, perhaps the CSS as well, and enlighten me as to how I can achieve the look of the middle column [shown here](http://wspentertainment.com/patriot/example01.html), only extended to cover the width of the section between the header and footer?

Thank you very very much.