how should I order my divs?

Posted by aslum on Stack Overflow See other posts from Stack Overflow or by aslum
Published on 2010-04-14T19:59:58Z Indexed on 2010/04/14 20:03 UTC
Read the original article Hit count: 445

Filed under:

css

|

divs

|

css-floating

|

div-layouts

|

css-layout

Here's the basic layout of a page I'm working on:
alt text
What would be the best/easiest way to order the divs? C may or may not be visible (it's a news alert that only displays when there is news). A = Header, B = Menu, E&F = standard content columns, D = latest blog post. I'm thinking ABCEFD might make the most sense, but I could also see ABCDEF. Either of those should be fairly easy to do right using floats... is there a better way? Maybe put CEF inside a "middle column" div?

© Stack Overflow or respective owner

Related posts about css

HTMLUNIT Facebook javascript warning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi I am trying to create simple application that would be able to search people on facebook using given e-mail. I am already able to log into an account using the HTMLunit tool and even create a page, which should throw result of my search. But when I try to print the result as XML the file is missing… >>> More
$this->headLink() includes duplicated script

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, Just like I did before, I used the following code for my new project. <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/button.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/inputText.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/fancyTable… >>> More
How much multiple style sheets slow down to website?

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is 3 css file (one is only for IE) <link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print"> <!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie… >>> More
mod_pagespeed is rewriting but not combining

as seen on Stack Overflow - Search for 'Stack Overflow'
I have the following problem. I installed mod_pagespeed but i am not getting the results i want! It does rewrite my css and changes the to the cache url but its not combining the css files. I have seached the web and stackoverflow for it but did not find a solution. Here are the tags <link… >>> More
CSS import or multiple CSS files

as seen on Stack Overflow - Search for 'Stack Overflow'
I originally wanted to include a .css in my HTML doc that loads multiple other .css files in order to divide up some chunks of code for development purposes. I have created a test page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional… >>> More

Related posts about divs

convert divs displaying as row to divs displaying as column

as seen on Stack Overflow - Search for 'Stack Overflow'
I have as the following divs. Suppose each div is floated left or set display to inline-block. +-----------+ +-----------+ +--------------+ | 1 | | 2 | | | +-----------+ | | | 3 | +-----------+ | | … >>> More
Using Javascript to expand DIVs and go to anchor text

as seen on Stack Overflow - Search for 'Stack Overflow'
I apologize that this question is so similar to "How can you check for a #hash in a URL using JavaScript?" but would appreciate your help with the following. I would like to use Javascript to display text that is a) identified by an anchor. b) contained within 2 collapsed DIVs....ONLY WHEN the… >>> More
jquery slide toggle divs without creating multiple classes, functions, etc... ui accordion

as seen on Stack Overflow - Search for 'Stack Overflow'
Greetings, based on the jquery ui accordion I'm using, I have added a slide toggle to my accordion list items. so what happens is I click on an li and a div slides down underneath to reveal more content. The issue I'm having is that I find myself having to create multiple id's to reference… >>> More
For "draggable" div tags that are NOT nested: JQuery/JavaScript div tag “containment” approach/algor

as seen on Stack Overflow - Search for 'Stack Overflow'
Background: I've created an online circuit design application where .draggable() div tags are containers that contain smaller div containers and so forth. Question: For any particular div tag I need to quickly identify if it contains other div tags (that may in turn contain other div tags). -- Since… >>> More
Multi-Page invoice printing on one page

as seen on Stack Overflow - Search for 'Stack Overflow'
I have an invoice that contains over 100 lines of product that I am trying to print. This single invoice should take over 3 pages, but when printed, the content flows off the footer and the next page is the following invoice. I am using divs instead of tables, and I can't understand why the long… >>> More