DanielHardy Posted March 25, 2009 Share Posted March 25, 2009 Hi, I know this is quite a common and problem, and it is one that often make me want to pull my hair out! The problem this time is that my problems arise from a database generated layout. In that, depending on how many fields are in a database, my code will display a number of small divs. When viewed in firefox it displays perfectly as I would want, but in I.E it goes all funny. Here is the code <?php mysql_connect("localhost", "0607197", "12345") or die("Can't connect to database server!"); mysql_select_db("db0607197") or die(" Can't select database!"); $updated = FALSE; if(count($_POST) > 0){ $admin = $_POST['admin']; array_map('intval',$admin); $admin = implode(',',$admin); mysql_query("UPDATE seats SET admin=1 WHERE id IN ($admin)") or trigger_error(mysql_error(),E_USER_ERROR); $updated=TRUE; } ?> <form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post"> <?php ?> <?php $booked = "<b>Seat Booked</b>"; $sql = "SELECT id,username,admin,rowId,columnId FROM seats ORDER by id ASC"; $result = mysql_query($sql) or trigger_error(mysql_error(),E_USER_ERROR); while(list($id,$username,$admin,$columnId,$rowId,)=mysql_fetch_row($result)){ if($admin==1){ echo '<div style="background-color:red;align:center;width:53px;text-align:center;padding-top:5px;padding-bottom:5px;float:right;height:43px;border:2px solid #FFFFFF;"><b><font color="black">'.$rowId.''.$columnId.'</div>'."\n"; } if($admin==0){ $checked = ($admin==1) ? 'checked="checked"' : ''; echo '<div style="background-color:green;padding-bottom:5px;align:center;width:53px;font-weight:bold;text-align:center;padding-top:5px;float:right;height:43px;border:2px solid #FFFFFF;"><b><font color="black">'.$rowId.''.$columnId.'<input type="checkbox" name="admin[]" value="'.$id.'" /></div>'."\n"; } } ?> <p><div style="float:bottom;text-align:center;paddin-top:40px;"><input type="submit" name="submit" value="Book Seat" /> </div> </form> Could this be solved by some simple CSS? Position:absolute perhaps or will I need a better, more efficient way of outputting the data? Advice please. Thanks in advance Daniel Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/ Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 This is a HTML/CSS issue and should really be posted in the relevant forum. Let's say Firefox displays properly and IE has its quirks that make peole have to write all sorts of patches to get things to work. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793428 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 Wasnt sure whether it was a CSS issue. As when I have fiddled around with php coding, the display has changed. I will take my query elsewhere! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793434 Share on other sites More sharing options...
RichardRotterdam Posted March 25, 2009 Share Posted March 25, 2009 This is indeed HTML/CSS related. Your Browser (IE, Firefox etc) will not see a line of php code. In your browser click "view source" and past the HTML and CSS which causes the problem. Do not paste the whole page which will annoy most on this forum Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793437 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 If you're using Firefox try these two plugins - invaluable! 1. https://addons.mozilla.org/en-US/firefox/addon/60 2. https://addons.mozilla.org/firefox/addon/1843 Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793446 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 I had already done this Kat. The problem is that I have a series of checkboxes within divs. When submitted, the database updates and then the same div is displayed but in red (rather than green) with no checkbox option. I have set the two different divs as the same height but in I.E they insist on being smaller. Any Ideas? <div style="background-color:green;padding-bottom:5px;align:center;width:53px;font-weight:bold;text-align:center;padding-top:5px;float:right;height:43px;border:2px solid #FFFFFF;"><b><font color="black">uCE08<input type="checkbox" name="admin[]" value="28" /></div> <div style="background-color:red;align:center;width:53px;text-align:center;padding-top:5px;padding-bottom:5px;float:right;height:43px;border:2px solid #FFFFFF;"><b><font color="black">uCE09</div> Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793449 Share on other sites More sharing options...
phpretard Posted March 25, 2009 Share Posted March 25, 2009 I always build 2 different style sheets...one for IE and one for FF. <!--[if IE]> <link rel="stylesheet" type="text/css" href="IE-stylesheet.css" /> <![endif]--> <![if !IE]> <link rel="stylesheet" type="text/css" href="default-stylesheet.css" /> <![endif]> This method does not rely on javascript, so it will work even if javascript is disabled. The <![if IE]>, <![if !IE]>, and <![endif]> tags are only recognized by Internet Explorer. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793450 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 If you've got your website online and not working on it locally can you post a link so we can take a look? Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793454 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 phpretard that sounds like a handy little idea. Im gonna take a look at that.Thanks. The website is: http://mi-linux.wlv.ac.uk/~0607197/test.php you will need to log in. Username : d Password : d Feel free the play around with it as I can update the database later. NOTE: In I.E if all the divs are set as available (includes checkbox) the layout is fine. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793455 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 I've got it in both IE and FF - I'm presuming this should be one large rectangle with no gaps and the red boxes should be looking like the green? Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793456 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 Also, what does this do? border-left-color-ltr-source Never seen that before! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793457 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 yes exactly, reds looking like the green but just without a checkbox. Please no comments on the design by the way! I know it sucks at the moment! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793458 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 I can see "height" is set to 43 in both green and red. I've had this issue before and can't recall exactly how I fixed it although how about creating a 1x1pixel square transparent GIF and where you've got a red box (no checkbox) place this 1x1pixel GIF and stretch it to the same dimensions of a checkbox? <img src="transparent.gif" alt="" width="13" height="13" /> No comment on the design? Seriously, yoiu've not seen my design skills - I have to get someone else to do that for me! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793459 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 Its an idea and certainly worth a shot. Let you know results soon Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793460 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 The only other thing I can think of is to convert that lot into a table - I didn't realise you were using DIVs for the whole thing! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793461 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 I've tried with tables and and was really struggling to be honest. Do you have a suggestion how I could do it with a table? Somehow I missed the table chapter in my HTML book all those years ago! Oh and the image didn't work. I'm enjoying your help though Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793468 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 How are you pulling the data from the database? Is this one query for everything or separate queries from separate tables? I'm also thinking the CSS can do with a re-va,p - let me play with it in Firebug and see what I can come up with. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793470 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 it's just the one query : $sql = "SELECT id,username,admin,rowId,columnId FROM seats ORDER by id ASC"; Ok thanks mate Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793471 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 I've just knocked this up - works in both IE and FF and works absolutely fine with and without checkboxes. <html> <head> <title>TEST</title> <style type="text/css"> body { margin: 0px; padding: 0px; } div#container { width: 850px; font-family: calibri,arial,verdana,sans-serif; font-size: 0.8em; color: #000000; font-weight: bold; text-align: center; } div#container div#boxgreen { background-color: #008800; margin: 2px; padding-top: 5px; width: 49px; height: 49px; float: left; } div#container div#boxred { background-color: #ff0000; margin: 2px; padding-top: 5px; width: 49px; height: 49px; float: left; } </style> </head> <body> <div id="container"> <div id="boxgreen"> uCF125<br /> <input type="checkbox" /> </div> <div id="boxgreen"> uCF125<br /> <input type="checkbox" /> </div> <div id="boxred"> uCF125 </div> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793475 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 Forgot to mention, to centre the lot I've added one line of CSS in each of these: body { margin: 0px; padding: 0px; text-align: center; } div#container { width: 850px; font-family: calibri,arial,verdana,sans-serif; font-size: 0.8em; color: #000000; font-weight: bold; text-align: center; margin: 0px auto; } If you move the color attribute out of the container and into both boxgreen and boxred you can have different colored text in them - black doesn't really mix well with both. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793482 Share on other sites More sharing options...
DanielHardy Posted March 25, 2009 Author Share Posted March 25, 2009 Wouldn't you know you've gone and solved it! Any ideas where my problem stemmed from? Is that Firebug helpful then? May I say thanks! Can get back to some serious coding now! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793487 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 Firebug is GREAT I can't live without it. You can edit the CSS live and see what the changes are making on the browser as you change them. Allows for a whole lot more. On installing it adds a little "bug" icon in the bottom right corner of the browser - click it to activate it. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793488 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 I think the problem was stemming from all the extra CSS I saw being used - conflicting but not sure but there was LOADS of it for each cell, some I'd never seen before. Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793491 Share on other sites More sharing options...
sasa Posted March 25, 2009 Share Posted March 25, 2009 if you look source of your page it's start <LINK rel="stylesheet" href="regal.css" type="text/css"> </head> <BODY> <div id="mainsite" style="text-align:center;"> <div id="toppic"><div id="topgap" style="height:70px;"> </div><div id="nav"> <div id="navgapper"> <div class="clean22" style="padding-top:7px;padding-left:5px; font-weight:bold;border-right:2px double #FFFFFF;height:30px;color:FFFFFF;"> Hello <font color="#000000"> d</font> <a href=logout.php><b>Logout</b></a> </div> </div> <div class="nav1"> <a href="regal1.php">Home</a> </div> <div class="nav1"> <a href="regal2.php">Events</a> </div> <div class="nav1"> <a href="regal3.php">Prices</a> </div> <div class="nav2"> <a href="test.php">Book</a> </div> <div class="nav1"> <a href="regal4.php">Contact Us</a> </div> </div> </div> <p><p> <HTML> <HEAD> <TITLE>Welcome To The Royal Regal Theatre!</TITLE> <META NAME="keywords" CONTENT="PHP, Classes"> </HEAD> <BODY> <HTML> <BODY> </BODY> </HTML> </BODY> </HTML> <div id="bookings"> is it look OK for you Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793498 Share on other sites More sharing options...
Yesideez Posted March 25, 2009 Share Posted March 25, 2009 OUCH! I forgot to mention that! Quote Link to comment https://forums.phpfreaks.com/topic/151027-solved-differences-between-firefox-and-internet-explorer/#findComment-793510 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.