Solved

3 column fluid layout

Posted on 2011-09-30
8
226 Views
Last Modified: 2012-05-12
I'm just wondering, is there an easy way to create a 3 column layout using CSS where the left and right column are fixed widths, but the center column stretches to fill the available space?

I know I could do it using javascript by getting the browser width and deducting the width of the left and right columns, then setting the center column to the remaining width.

Is there a way to do it without javascript?
0
Comment
Question by:SheppardDigital
  • 5
  • 3
8 Comments
 
LVL 30

Expert Comment

by:LZ1
ID: 36891715
0
 

Author Comment

by:SheppardDigital
ID: 36891867
Kind of like that, my only problem is I've also got a 100% header above the three columns, so it makes it difficult to add the left and right padding to the body.
0
 
LVL 30

Expert Comment

by:LZ1
ID: 36891874
Can you show us an image of exactly what your looking for?
0
 

Author Comment

by:SheppardDigital
ID: 36891924
0
What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

 
LVL 30

Expert Comment

by:LZ1
ID: 36891958
Are you going to wrap everything in a container of some sort? Something with a fixed width?
0
 

Author Comment

by:SheppardDigital
ID: 36891973
No there won't be a container with a fixed width because I want the header to fill the full width of the browser window, as well as the three columns.

I wonder if it might be easier to use javascript?
0
 
LVL 30

Expert Comment

by:LZ1
ID: 36892039
Not necessarily. We may just be able to modify the CSS layout I sent you. Give me a few.
0
 
LVL 30

Accepted Solution

by:
LZ1 earned 500 total points
ID: 36892483
0

Featured Post

Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

Join & Write a Comment

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

706 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

12 Experts available now in Live!

Get 1:1 Help Now