Flexible width columns

Just need, say, 3 columns [will change - could be up to 4] that are all flexible width (filling in the screen).

Is there a way to do this w/ CSS? So like three blocks, all lined up horizontally, fill in the screen.

Answers


Your question is a bit vague. However, the simple solution is:

EDITED: Duh, forgot my positioning info.

HTML

<div class="c1"></div>
<div class="c2"></div>
<div class="c3"></div>

CSS

html, body {
   height: 100%;
   position: relative; 
}

.c1 {
   height: 100%;
   width: 33.3%;
   position: absolute;
   left: 0;
   top: 0;
}

.c2 {
   height: 100%;
   width: 33.3%;
   position: absolute;
   left: 33.3%;
   top: 0;
}

.c3 {
   height: 100%;
   width: 33.3%;
   position: absolute;
   left: 66.6%;
   top: 0;
}

Note: there are various ways to do it. Floats can be used, inline-block, etc.


There is also a jQuery Layout plugin which might fit your needs, though it is more than CSS:

http://layout.jquery-dev.net/demos/accordion.html


Need Your Help

How to add a text node to a toast notification

delphi delphi-xe8

This toast notification works very well from the desktop with XE8 With Windows 10, but I can not figure out how to add a text line to the notification. iTitle is displayed but iMessage is not. Th...

find files modified between two dates using php

php date datetime filemtime

I'm getting thoroughly confused about the various date functions and formats in php so I would like to ask for help if possible.

hibernate configuration in jboss 4.0.5

hibernate jboss-4.0.x

i am trying to create a hibernate project with jdeveloper postgres 9.3 and jboss 4.0.5.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.