0

I need to create following page layout using Divs.

http://jsfiddle.net/6Lanq/ (please use horizontal and vertical scrollbar to see the exact picture. we have four zones)

I accomplished it using nested divs and float but nested divs are not what is required. Other way of doing, that I know, is declaring "position:absolute" and setting z-index but this required exact top / right / bottom / left locations which are not desired.

It is possible to do the same without using nested divs and exact coordinates? Some find of float or dynamic solution?

mskfisher
  • 3,291
  • 4
  • 35
  • 48
Malik
  • 347
  • 1
  • 11
  • 29
  • You do not need top, right, bottom and left with absolute positioning. You just need the top and left, from there the width will take over. – Dustin Laine Oct 20 '10 at 19:20
  • @Dustin: Thanks for your reply. We can achieve this using top and left but we are looking for something dynamic instead of specifying coordinates. – Malik Oct 21 '10 at 05:47

1 Answers1

0

You'll have to use Position:Absolute, then, if you use Top and Left to set the position it will take the entire page, but if you use Margin-Top and Margin-Left, it will take as a reference the parent DIV.

Rama
  • 429
  • 1
  • 8
  • 14
  • Thanks for your reply. Any dynamic solution is possible? – Malik Oct 21 '10 at 06:06
  • Don´t know what you mean by dynamic in this solution, by you might use percentages instead of Pixels, that would give you more flexibility... – Rama Oct 21 '10 at 13:15