473,320 Members | 1,902 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Div alignment

dianagaby2002
I have 3 DIVs:
1st-> left,
2nd-> right side of 1 but a part of it is under 1(upper-left corner),
3rd-> right side of 2, like a menu.

So 1st is the smallest and covers upper-left corner of 2nd.

I can't set the "menu"-like DIV(3rd DIV) on the left of the 1st and 2: like 1,2,3.

This is my code:
Expand|Select|Wrap|Line Numbers
  1. <div id="container" style="width:1200px">
  2.  
  3.     <div id="header" style="background-image: url(imagini/hd.jpg); 
  4.     height:200px; width:1200px; text-align:center">
  5.  
  6.     <h1 style="margin-bottom:0">...</h1>
  7.     </div>
  8.  
  9.  
  10.     <div id="1st" style="background-color:#CC9966; width:400px; height:500px; z-index:1; float:left">
  11.  
  12.  
  13. </div>
  14.  
  15.  
  16.     <div id="2nd" style="background-color:#FFFFCC; width:900px; height:1000px; z-index:-1;">
  17.     wqfwqfaf<br>
  18.     ajnkm;sa<br>
  19.     </div>
  20.  
  21.  
  22.     <div id="menu(3rd)" style="background-color:#CCCC66; height:600px; width:200px">
  23.     </div>
  24.  
  25.  
  26.     </div>
  27.  
Thank you in advance!
Dec 10 '12 #1

✓ answered by Rabbit

1) You shouldn't inline your styles unless you have to.

2) You need to float the middle div if you want the right div to be next to it.

3) The widths of your 3 divs added together is larger than your container.

4) Even if you make them equal, you need to account for paddings, margins, borders, etc.

2 2666
Rabbit
12,516 Expert Mod 8TB
1) You shouldn't inline your styles unless you have to.

2) You need to float the middle div if you want the right div to be next to it.

3) The widths of your 3 divs added together is larger than your container.

4) Even if you make them equal, you need to account for paddings, margins, borders, etc.
Dec 10 '12 #2
here is solution of your problem:
Expand|Select|Wrap|Line Numbers
  1. <div id="container" style="">
  2.  
  3.     <div id="header" style="background-image: url(imagini/hd.jpg); 
  4.     height:200px; width:1200px; text-align:center">
  5.  
  6.     <h1 style="margin-bottom:0">...</h1>
  7.     </div>
  8.  
  9.  
  10.     <div id="1st" style="background-color:#CC9966; width:400px; height:500px; z-index:1;float:left;">
  11.  
  12.  
  13. </div>
  14.  
  15.  
  16.     <div id="2nd" style="background-color:#FFFFCC; width:900px; height:1000px; z-index:-1;position:absolute;">
  17.     wqfwqfaf<br>
  18.     ajnkm;sa<br>
  19.     </div>
  20.  
  21.  
  22.     <div id="menu(3rd)" style="background-color:#CCCC66; height:600px; width:200px;position:absolute;margin-left:900px;">
  23.     </div>
  24.  
  25.  
  26.     </div>
for more help<link removed>
Dec 31 '12 #3

Sign in to post your reply or Sign up for a free account.

Similar topics

4
by: Shashi | last post by:
Can somebody explain how the byte alignment for structures work, taking the following example and considering: byte of 1 Byte word of 2 Bytes dword of 4 Bytes typedef struct { byte a; word...
10
by: j0mbolar | last post by:
for any pointer to T, does a pointer to T have different or can have different alignment requirement than a pointer to pointer to T? if so, where is the exact wording in the standard that would...
67
by: S.Tobias | last post by:
I would like to check if I understand the following excerpt correctly: 6.2.5#26 (Types): All pointers to structure types shall have the same representation and alignment requirements as each...
7
by: Earl | last post by:
Any known fixes for the wacky right-alignment bug in the WinForms datagrid (VS2003)? I've tried Ken's workaround...
13
by: aegis | last post by:
The following was mentioned by Eric Sosman from http://groups.google.com/group/comp.lang.c/msg/b696b28f59b9dac4?dmode=source "The alignment requirement for any type T must be a divisor of...
12
by: Yevgen Muntyan | last post by:
Hey, Consider the following code: #include <stdlib.h> #define MAGIC_NUMBER 64 void *my_malloc (size_t n) { char *result = malloc (n + MAGIC_NUMBER);
10
by: haomiao | last post by:
I want to implement a common list that can cantain any type of data, so I declare the list as (briefly) --------------------------------------- struct list { int data_size; int node_num;...
55
by: fishpond | last post by:
How to declare a variable guaranteed to have the strictest possible alignment? -- The defense attorney was hammering away at the plaintiff: "You claim," he jeered, "that my client came at you...
2
by: somenath | last post by:
Hi All, I have one question regarding the alignment of pointer returned by malloc. In K&R2 page number 186 one union is used to enforce the alignment as mentioned bellow. typedef long...
2
by: uamusa | last post by:
I am Dynamically generating a proposal(report) in MS Word. By default the Paragraph Alignment is "Left". For the First 6 Paragraphs I set the Alignment to "Center", and then when attempting to...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.