 |  |  |  |  |  |  |  |
3 div problem
Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
 |
Hi,
I want middle Div to be automatically adjusted between left and right divs. When i write a long sentence or add something into middle div, the right div is pushed down. How can i make them stable?
Thanks
I want middle Div to be automatically adjusted between left and right divs. When i write a long sentence or add something into middle div, the right div is pushed down. How can i make them stable?
Thanks
HTML and CSS Syntax (Toggle Plain Text)
i would suggest using some css to control all of those properties, it will make your life so much easier.
your problem is caused by the cumulative width of your divs being too wide for your screen size. one solution would be to give your center div a max-width to limit its width to a size that wont cause such problems.
one question, do you really want the width of your center div to vary based on the amount of text used? if so using max width is your best bet.
if i were u, i would use something that looks like this to create a three column styled sheet:
this will create the same basic effect of three columns, but they will always be the same size and should be easier to use as a site wide design...
your problem is caused by the cumulative width of your divs being too wide for your screen size. one solution would be to give your center div a max-width to limit its width to a size that wont cause such problems.
one question, do you really want the width of your center div to vary based on the amount of text used? if so using max width is your best bet.
if i were u, i would use something that looks like this to create a three column styled sheet:
html Syntax (Toggle Plain Text)
this will create the same basic effect of three columns, but they will always be the same size and should be easier to use as a site wide design...
Last edited by peter_budo; Feb 15th, 2009 at 12:16 pm. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks) and [icode] (inline code) tags.
•
•
Join Date: Jan 2007
Posts: 3,210
Reputation: 
Solved Threads: 165
First of all, stop using pixels. Pixels freeze your page to work for only one screen resolution.
Use percent, and use points for font sizes.
Put 0 margins, borders, and padding on the divs that are using percents.
Text can not be placed directly inside a div. It must be inside another container, such as p.
Use percent, and use points for font sizes.
Put 0 margins, borders, and padding on the divs that are using percents.
Text can not be placed directly inside a div. It must be inside another container, such as p.
Daylight-saving time uses more gasoline
•
•
Join Date: Oct 2008
Posts: 76
Reputation:
Solved Threads: 6
Junior Poster in Training
Hi veledrom, for your own good try keeping your css external, or at least in the head. To move those divs I would use some positioning:
Beware! This code is not tested.
Naturally, you will have to apply the classes, like so:
Beware! This code is not tested.
<style type="text/css">
.right{
background-color:green;
height:auto;
width:33%;
position:fixed;
left:0%;
}
.left{
background-color:green;
height:auto;
width:33%;
position:fixed;
left:0%;
}
.center{
background-color:green;
margin:0 auto;
height:auto;
width:auto;
</style>Naturally, you will have to apply the classes, like so:
<div class="left"></div> <div class="center"></div> <div class="right"></div>
Last edited by ccube921; Feb 13th, 2009 at 3:24 pm. Reason: Extra comma
If I have been helpful add to my reputation!
|
Similar Threads
- Firefox floating div problem (HTML and CSS)
- CSS Div problem (HTML and CSS)
- CSS/ Div Positioning problem (HTML and CSS)
- In navigation display:block; property is giving problem in IE6 (HTML and CSS)
- I need to grab the height of a div. (JavaScript / DHTML / AJAX)
- Add textbox to editable div problem (JavaScript / DHTML / AJAX)
Other Threads in the HTML and CSS Forum
- Previous Thread: create a continuous marquee in flash...
- Next Thread: I've got 6 weeks to produce an on-line shop!!
| Thread Tools | Search this Thread |
Latest HTML and CSS Posts
- Today's Posts
- Unanswered Threads
Related Forum Features
Tag cloud for HTML and CSS
2002 appointments asp background backgroundcolor beta browser bug calendar cart cgi code codeinjection corporateidentity create css deleted design development displayimageinsteadofflash dreamweaver drupal emailmarketing epilepsy explorer firefox flash font fonts form format frontpage google griefers hackers hitcounter hover html ide ie7 ie8 iframe image images internet internetexplorer intranet iphone javascript jpeg layout macbook maps marketshare microsoft missing mozilla multimedia navigationbars news offshoreoutsourcingcompany opacity opera optimization perl pnginie6 positioning problem scroll seo shopping studio swf swf. templates textcolor theme timecolor titletags url urlseparatedwords visual visualization web webdevelopment webform website windows7 wordpress xml xsl
