[CSS] Combining pixel and percentage values

#1
ViliusSutkus

Posted 19 August 2010 - 01:14 AM

Newbie

Members
1 posts

Hi there.
I have a situation of three divs:

#a{ float: left; width: 200px; }

#b{ float: left; width: 100%-300px; }

#c{ float: right; width: 100px; }

The problem here is that css doesn't allow to do math, so I need a solution to expand div b to all the width thats unused.
Help appreaciated ^^

#2
Guest_johnny.dacu_*

Posted 19 August 2010 - 10:47 AM

Guests

Here is a quick solution... i hope it works:

#a{
width: 200px;
float: left;
}
#c{
width: 100px;
float: right;
}

#b{
width: 100%;
padding: 0 100px 0 200px;
}

#3
DarkLordofthePenguins

Posted 19 August 2010 - 03:22 PM

Programming Expert

Members
409 posts

So you want the width to be 100% of the containing element and 300 pixels at the same time?

There are two possibilities:

1. The containing element is constantly 300 pixels wide. In this case only the 100% or the 300px is necessary.

2. The containing element is of a varying width. If the element is not exactly 300 pixels wide, then the div will be 300 pixels wide and not 300 pixels wide at the same time. As you probably know, this is mathematically impossible.

I can't tell what it is that you're trying to accomplish here.

Edited by DarkLordofthePenguins, 19 August 2010 - 06:04 PM.