clausowitz Posted October 16, 2011 Share Posted October 16, 2011 All, I have this header on my page which shown some icons, for messages and friend requests. I bit like facebook. When the user has unread messages it shows the number in a red block. Problem is how to position the number so that is is on top of the right icon. At home is displays fine but at work it is too mucg to the right. $msgs = '<a href="profile.php?id=' . $logOptions_id . '"><img src="images/msg.png" width="16" height="13" alt="Board Messages" title="Board Messages" border="0"/></a><span style="position: absolute; left: 885px; top: 18px; font-weight:bolder; background-color:red; color:#FFFFFF;"> '.$num_new_msgs.' </span>'; What is wrong with my code? Marco Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/ Share on other sites More sharing options...
teynon Posted October 16, 2011 Share Posted October 16, 2011 Can you post a link to a working copy so we can see what you are talking about? Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279748 Share on other sites More sharing options...
clausowitz Posted October 16, 2011 Author Share Posted October 16, 2011 Would love to but the website is resctricted to users only. I can show you what it looks like, or should look like. [attachment deleted by admin] Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279749 Share on other sites More sharing options...
teynon Posted October 16, 2011 Share Posted October 16, 2011 Essentially I need to see the actual html / css code of the website and what the current result is. It's very hard to work on a puzzle without all the pieces. Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279751 Share on other sites More sharing options...
teynon Posted October 16, 2011 Share Posted October 16, 2011 An attempt to answer this question without digging to far is this: position: absolute; left: 885px; top: 18px; This object is positioned absolutely on the page. That means if the users screen is wider than yours, it's position, relative to everything else, will be different. The way you fix this is encapsulate it inside of the link. <a href="profile.php?id=' . $logOptions_id . '" style="position: relative;"><img src="images/msg.png" width="16" height="13" alt="Board Messages" title="Board Messages" border="0"/><span style="position: absolute; left: 15px; top: 18px; font-weight:bolder; background-color:red; color:#FFFFFF;"> '.$num_new_msgs.' </span></a> You will have to readjust the pixels for the span to fit properly, however. Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279752 Share on other sites More sharing options...
clausowitz Posted October 16, 2011 Author Share Posted October 16, 2011 That's no problem, I thought you meant an online copy. $sql_msg_check = mysql_query("SELECT * FROM profile_comments WHERE profile_id='$logOptions_id' AND date >= '$new_date' ORDER BY id DESC"); $num_new_msgs = mysql_num_rows($sql_msg_check); if ($num_new_msgs > 0 && $page_visited <> "True" ) { $msgs = '<a href="profile.php?id=' . $logOptions_id . '"><img src="images/msg.png" width="16" height="13" alt="Board Messages" title="Board Messages" border="0"/></a><span style="position: absolute; left: 885px; top: 18px; font-weight:bolder; background-color:red; color:#FFFFFF;"> '.$num_new_msgs.' </span>'; } else { $msgs = '<a href="profile.php?id=' . $logOptions_id . '"><img src="images/msg.png" width="16" height="13" title="Board Messages" alt="Board Messages" border="0"/></a> '; } <div style="background-image:url(style/headerStrip.jpg); height:50px; border-bottom:#999 1px solid;"> <table width="900" align="center" cellpadding="0" cellspacing="0" > <tr> <td width="156"><a href="http://<?php echo $dyn_www; ?>/index.php"><img src="images/logo2.png" alt="" title="" width="156" height="48" border="0" /></a></td> <td width="419"> <div class="headerBtns" style="margin-top:12px;"> <?php if (isset($_SESSION['idx'])) { echo '<a href="http://'; echo $dyn_www; echo '/member_search.php">Members</a>'; echo '<a href="http://'; echo $dyn_www; echo '/gallery.php">Gallery</a>'; echo '<a href="http://'; echo $dyn_www; echo '/calen.php">Calendar</a>'; echo '<a href="http://'; echo $dyn_www; echo '/myMap.php">Maps</a>'; echo '<a href="http://'; echo $dyn_www; echo '/ladies.php">Ladies</a>';} else { echo '<a href="http://'; echo $dyn_www; echo '/support.php">Support</a>'; echo '<a href="http://'; echo $dyn_www; echo '/myMap.php">Maps</a>'; } ?> </div> </td> <td width="323"><div align="right" style="margin-bottom:12px;"> <?php echo $logOptions; ?></div></td> </tr> </table> </div> Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279753 Share on other sites More sharing options...
teynon Posted October 16, 2011 Share Posted October 16, 2011 I don't really want the PHP code. I just need the code outputted to the browser. Have you tried to fix it with the sample I posted above? My guess is that may actually be the answer. Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279760 Share on other sites More sharing options...
clausowitz Posted October 16, 2011 Author Share Posted October 16, 2011 It does work in my browser, I guess it will elsewhere, but I have to try tomorrow. Thanks so far. Quote Link to comment https://forums.phpfreaks.com/topic/249213-relative-or-absolute/#findComment-1279763 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.