Is it possible to mix fixed left offset with relative width in CSS?

I have a situation like this:

+------------------------------------------------------------------------------+
|                                                                              |
|                      +---------------------------------------------------+   |
|                      |                                                   |   |
| <-  fixed width  ->  | <-                flexible width               -> |   |
|                      |                                                   |   |
|                      +---------------------------------------------------+   |
|                                                                              |
| <-                         flexible width                                 -> |
|                                                                              |
+------------------------------------------------------------------------------+

      

What this should represent is the outer DIV and its child (also the DIV) displayed in the browser. The outer div takes up, say, 90% of the viewable area (width: 90%)

. If the screen is resized, the size will be resized. It is okay for it to have a minimum width.

The child div must contain a fixed number of pixels to the left of the outer DIV (left: 200px)

.

I would like it to resize with its parent (i.e. childWidth = (parentWidth - 200) * .9).

Can this be done with CSS / how?

+3


source to share


1 answer


Yes, just add right: 0px

to the inner div in addition to left

.



(also, try jsfiddle.net instead of ascii;))

+3


source







All Articles