homepage Welcome to WebmasterWorld Guest from 54.227.40.166
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
Center middle div
Newbie_UK




msg:4393543
 6:59 pm on Dec 2, 2011 (gmt 0)

Hi guys,

I'm a total newbie to html so please be gentle

I have 3 divs and I want the middle div to be a static size and to be centered on the screen but the 2 either side of it to grow depending on screen with...

Is this possible?

Many Thanks

Ian

 

Skier88




msg:4393593
 9:48 pm on Dec 2, 2011 (gmt 0)

Here's the best I could come up with.

<!doctype html>
<html lang='en'>
<head>
<meta charset='utf-8'>
<title>layout test</title>
<style type='text/css'>
* {margin:0; padding:0;}
div {height:100px;}
#l {float:left; width:50%;}
#l div {margin-right:200px; background:#f88;}
#m {width:400px; margin:0 auto; background:#8f8;}
#r {position:absolute; right:0; top:0; width:50%;}
#r div {margin-left:200px; background:#88f;}
</style>
</head>
<body>
<div id='l'><div></div></div>
<div id='m'></div>
<div id='r'><div></div></div>
</body>
</html>


Of course, it would be far simpler to just center the middle div and have fixed-width sidebars.

Newbie_UK




msg:4393606
 10:29 pm on Dec 2, 2011 (gmt 0)

Thanks Skier88

That will work a treat

Regards

Ian

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved