Member Avatar for kimmi_baby

Hi,
What I'm wanting to do is create a fixed and fluid layout. I was pretty sure it was possible but I'm not quite sure how to do it.

The layout I want will have 2 columns within a wrap div.

The left column will have 2 divs. The div on the top is the header and the div below is the navigation. This will be the fixed column. This will also be positioned to the very left of the page.

The right column will be the content div. The content div is the one I would like to be fluid. I would like it to expand depending on the size of the screen. The problem I think I'm finding is that the background will be an image (I'm not quite sure how to make this expand or what size I should set the photo).

Any help would be greatly appreciated!!

Edited by kimmi_baby because: n/a
  • 2 Contributors
  • 3 Replies
  • 172 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by MagicMedia
Member Avatar for MagicMedia

You don't need to tell it to expand. Div is fluid by default. All you need to do is wrap the header and the navigation and give the wrapper a fixed width and a left float.

#wrapper {
width:200px;
float:left;
}
Member Avatar for kimmi_baby

So I wrap the div around the header and nav div?

What about the content div? The background image doesn't resize itself on each screen size...
At the moment it's a small image on my massive monitor so it will fit on the smallest screens. That's not what I'm wanting...

Is there a way to make the content div expand?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.