vividona Posted March 23, 2011 Share Posted March 23, 2011 Hi guys, please check this : @charset "utf-8"; html { padding:0; margin:0;} body { margin: 0; padding: 0; background:#A5DDF8 url(images/main_bg.png) top repeat-x; font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif; color: #000; text-align: center; /*direction: rtl;*/ } #wrapper { width: 100%; margin: 0 auto; padding: 0; border: 1px solid #fff; } #head { margin: 0 auto; width:966px; } #loginInfo{ width:400px; float: right; clear: left; border: 1px solid #b30f0e; font: normal 0.7em Tahoma, Geneva, sans-serif; color: #fff; } the problem is in opera: the width of (head div) is 100% I need it to be 966px. I don't need it to be full screen. Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/ Share on other sites More sharing options...
cssfreakie Posted March 23, 2011 Share Posted March 23, 2011 well your css looks okay, what does your html look like or maybe got an online example? Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/#findComment-1191221 Share on other sites More sharing options...
vividona Posted March 23, 2011 Author Share Posted March 23, 2011 well your css looks okay, what does your html look like or maybe got an online example? Hi, please see padding in FF is wider than opera <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <body> <div id="wrapper"> <div id="head"> <div id="loginInfo">Loggedin data here</div> <div id="header"> <h1><a href="index.php">Header stuff here</h2> </div> </div> </div> </body> </html> [attachment deleted by admin] Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/#findComment-1191229 Share on other sites More sharing options...
cssfreakie Posted March 23, 2011 Share Posted March 23, 2011 well that is something different, maybe ad this: #loginInfo{ width:400px; float: right; clear: left; border: 1px solid #b30f0e; font: normal 0.7em Tahoma, Geneva, sans-serif; color: #fff; padding:0; margin:0; } But without html code, this will just be guessing Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/#findComment-1191232 Share on other sites More sharing options...
vividona Posted March 23, 2011 Author Share Posted March 23, 2011 Hi, I need the space between (loginInfo div ) and the (wrapper) to be same in FF and opera Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/#findComment-1191234 Share on other sites More sharing options...
cssfreakie Posted March 23, 2011 Share Posted March 23, 2011 well that is a bit tricky when the wrapper has a width of 100%, anyways i tried the code below in the newest version of opera and firefox and it seems to look the same. Although i changed the following line which is full of errors: <h1><a href="index.php">Header stuff here</h2> to <h1><a href="index.php">Header stuff here</a></h1> I also added a little color to the background so i have some more visual reference of what i am doing instead of blindly guessing <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head><title>align stuff</title></head> <body> <style type="text/css"> html { padding:0; margin:0;} body { margin: 0; padding: 0; background:#A5DDF8 url(images/main_bg.png) top repeat-x; font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif; color: #000; text-align: center; /*direction: rtl;*/ } #wrapper { width: 100%; margin: 0 auto; padding: 0; border: 1px solid #fff; } #head { margin: 0 auto; width:966px; background:#f4a; } #loginInfo{ width:400px; float: right; clear: left; border: 1px solid #b30f0e; font: normal 0.7em Tahoma, Geneva, sans-serif; color: #fff; } </style> <div id="wrapper"> <div id="head"> <div id="loginInfo">Logged in data here</div> <div id="header"> <h1><a href="index.php">Header stuff here</a></h1> </div> </div> </div> </body> </html> _edit: you might consider to use something as a reset.css (see sticky) Link to comment https://forums.phpfreaks.com/topic/231472-header-width-in-opera/#findComment-1191255 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.