Share your knowledge at the LQ Wiki.
Go Back > Forums > Non-*NIX Forums > Programming
User Name
Programming This forum is for all programming questions.
The question does not have to be directly related to Linux and any language is fair game.


  Search this Thread
Old 06-15-2011, 09:00 AM   #1
Registered: Jun 2007
Location: Munich, Germany
Distribution: RHEL, CentOS, Fedora, SLES (...)
Posts: 399

Rep: Reputation: 40
[HTML|CSS] Move div with placeholder so that div in row above may overlap

Currently I have an issue with a html page with css layout.

I use div blocks to visualize servers within a blade enclosure on a html page.
Some servers are fullsize, others are halfsize.
The css layout looks ok unless the second row misses some elements.

My assumption:
I would need a div that I can use as placeholder so that neighbor divs are placed in the right column. Those placeholder divs should be overlapped by divs from row1 that are bigger in size.

For example if bay 3 and 4 of row1 are occupied by a fullsize blade, 2 divs in 3 and 4 will be missing. The result is that the divs that should be displayed in bay 5 and 6 are placed in bay 3 and 4 instead of bay 5 and 6 where they would belong.

Because the "empty space" divs are non overlapable, the "fullsize" divs from row1 column 3 and 4 are truncated. They should span to the second row and the "empty space" divs in row2 column 3 and 4 should move right to column 5 and 6.


     1  2  3  4  5  6  7  8
ROW2[L][ ][x][x]......[L][L]

     1  2  3  4  5  6  7  8
ROW2[L][ ][L][L][x][x][L][L]
[x] Halfsize div (symbolizing empty enclosure bay)
[ ] Halfsize div (symbolizing occupied enclosure bay)
[L] Fullsize div (symbolizing occupied fullsize encl. bay; element begins in row1 and is spanning two rows)
... No div/Display error
|-> Move div
As this html page is automatically generated once a day, I need to use something like a div placeholder as I cannot easily modify the position of an individual element.
How would I accomplish this? Any help is appreciated!

Last edited by brianmcgee; 06-15-2011 at 09:04 AM.
Old 06-15-2011, 01:08 PM   #2
LQ 5k Club
Registered: Aug 2005
Distribution: OpenSuse, Fedora, Redhat, Debian
Posts: 5,398
Blog Entries: 2

Rep: Reputation: 908Reputation: 908Reputation: 908Reputation: 908Reputation: 908Reputation: 908Reputation: 908Reputation: 908
If you have the code that automatically generates the HTML, then post the relevant segment here (use [CODE][/CODE] tags please).
What about the approach of using HTML tables to aid in formatting? After all, your date is tabular in nature.
--- rod.

EDIT: Oh, I see you already know about the the code tags. :-)

Last edited by theNbomr; 06-15-2011 at 01:11 PM.


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
HTML / CSS: Overflow div in a table rubadub Programming 3 06-08-2010 07:04 PM
CSS: get div to expand with content Ephracis Programming 1 10-05-2009 11:50 AM
html / css footer <div> won't behave esteeven Programming 2 08-02-2009 08:04 AM
CSS div layout Chronothread Programming 1 09-29-2008 06:00 PM
css/html wtf? extra space below div nkoplm Programming 1 06-27-2007 03:31 PM > Forums > Non-*NIX Forums > Programming

All times are GMT -5. The time now is 07:24 AM.

Main Menu
Write for LQ is looking for people interested in writing Editorials, Articles, Reviews, and more. If you'd like to contribute content, let us know.
Main Menu
RSS1  Latest Threads
RSS1  LQ News
Twitter: @linuxquestions
Facebook: linuxquestions Google+: linuxquestions
Open Source Consulting | Domain Registration