blufish Posted August 15, 2008 Share Posted August 15, 2008 I have two problems, one is that the middle divs <div style="display: inline; background: url(left.gif); width: 25; align: center;"></div> <div style="display: inline; background-color: white; width: 85%; align: center;"></div> <div style="display: inline; background: url(right.gif); width: 25; align: center;"></div> All need to be the same height as the middle middle div, my second problem is that none of the divs show in Safari. Any ideas? <html> <head> <title>My Site</title> </head> <style type="text/css"> body {background-color: #cccccc;} </style> <body> <div style="text-align: center;"> <div style="display: inline; background: url(tl.gif); width: 25; height: 25; align: center;"></div> <div style="display: inline; background: url(top.gif); width: 85%; height: 25; align: center;"></div> <div style="display: inline; background: url(tr.gif); width: 25; height: 25; align: center;"></div> <br /> <div style="display: inline; background: url(left.gif); width: 25; align: center;"></div> <div style="display: inline; background-color: white; width: 85%; align: center;"></div> <div style="display: inline; background: url(right.gif); width: 25; align: center;"></div> <br /> <div style="display: inline; background: url(bl.gif); width: 25; height: 25; align: center;"></div> <div style="display: inline; background: url(bottom.gif); width: 85%; height: 25; align: center;"></div> <div style="display: inline; background: url(br.gif); width: 25; height: 25; align: center;"></div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/ Share on other sites More sharing options...
secoxxx Posted August 15, 2008 Share Posted August 15, 2008 are you trying to make a box you can add content to? also width and heights need "%" or "px" behind the value. Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617305 Share on other sites More sharing options...
blufish Posted August 15, 2008 Author Share Posted August 15, 2008 I added the px, yes I am making a box with rounded edges, both problems still remain, can't see in Safari and the boxes aren't the same size in IE. Any thoughts? Edit: Current Code <html> <head> <title>My Site</title> </head> <style type="text/css"> body {background-color: #cccccc;} </style> <body> <div style="text-align: center;"> <div style="display: inline; background: url(tl.gif); width: 25px; height: 25px; align: center;"></div> <div style="display: inline; background: url(top.gif); width: 85%; height: 25px; align: center;"></div> <div style="display: inline; background: url(tr.gif); width: 25px; height: 25px; align: center;"></div> <br /> <div style="display: inline; background: url(left.gif); width: 25px; align: center;"></div> <div style="display: inline; background-color: white; width: 85%; align: center;">hello all!dfdfdsvncvnvxcvn,mdxnv,mdsf<br><Br></div> <div style="display: inline; background: url(right.gif); width: 25px; align: center;"></div> <br /> <div style="display: inline; background: url(bl.gif); width: 25px; height: 25px; align: center;"></div> <div style="display: inline; background: url(bottom.gif); width: 85%; height: 25px; align: center;"></div> <div style="display: inline; background: url(br.gif); width: 25px; height: 25px; align: center;"></div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617308 Share on other sites More sharing options...
secoxxx Posted August 15, 2008 Share Posted August 15, 2008 if you dont mind, may i see one of the images of your box, if they are just rounded with no effects like drop shadow and stay 1 width just change hieght i will show you a easy trick Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617311 Share on other sites More sharing options...
blufish Posted August 15, 2008 Author Share Posted August 15, 2008 I uploaded it, http://www.frozenoven.com/webite Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617313 Share on other sites More sharing options...
secoxxx Posted August 15, 2008 Share Posted August 15, 2008 alright, ill brb with a nice lil trick Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617317 Share on other sites More sharing options...
blufish Posted August 15, 2008 Author Share Posted August 15, 2008 I found a solution on another site! thanks for the help Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617337 Share on other sites More sharing options...
secoxxx Posted August 15, 2008 Share Posted August 15, 2008 alright, if you get stumped again with it post away Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617345 Share on other sites More sharing options...
TheFilmGod Posted August 15, 2008 Share Posted August 15, 2008 Why are you using display: inline; ? Is there a good reason for it? Because otherwise, there is no reason why you should use it so. Quote Link to comment https://forums.phpfreaks.com/topic/119824-solved-div-layout/#findComment-617582 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.