Marquee, tables, and sizing

edesignuk

Moderator emeritus
Original poster
Mar 25, 2002
19,233
2
London, England
I've built a PHP/MySQL application to keep a record of and display current outages impacting the business. Everything was great, until there were enough outages that they were more than the width of the screen. dammit. Now I can't figure out how to solve the problem.

When the width of all the tables created by each outages record isn't more than the screen width available, they quite happily scroll across using the MARQUEE tags and look like this:



now when the number of outages and resulting tables are greater than the screen width available everything goes horribly wrong and scrunches up:



here is my code, any ideas how I can get round this?

PHP:
<?php require('inc_config.php'); ?>
<?php
$TodaysDate = date('d-m-Y');
$query = "SELECT * FROM Outages
WHERE LoggedDate = '$TodaysDate' OR Status='0' OR ResolvedDate='$TodaysDate' 
ORDER BY EventID DESC";
?>
<html>
<head>
<title><?php echo($Company); ?> Systems Outages - Scroller</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="refresh" content="60">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<link href="css/outages.css" rel="stylesheet" type="text/css">
<script src="js/outages.js"></script>

</head>

<body onLoad="javascript:ScrollerSize()" bottommargin="0" topmargin="0" leftmargin="0" rightmargin="0">

<marquee behavior="scroll" direction="left" scrollamount="7">
<table align="center" border="0">
<tr>

<?php
$result = mysql_query($query)
	or die ("Could not select data from SQL database.");
while ($row = mysql_fetch_array($result)){
extract($row)
?>
  <!-- table area to loop -->
    <!-- traffic lights -->
	<td class="indexTrafficLight"><?php 
	if ($Status=="0"){
	$TrafficLightSrc=$RedLightLargeSrc;
	}
	elseif ($Status=="1"){
	$TrafficLightSrc=$GreenLightLargeSrc;
	}
	?>
	<img src="<?php echo ($TrafficLightSrc); ?>"></td>
	
	<!-- details table container -->
	<td>
	
	<!-- details table -->
	<table>
	<tr><td class="indexCallRef"><?php echo ($CallRef); ?></td></tr>
	<tr><td class="indexSystemName"><?php echo ($System); ?></td></tr>
	<tr><td class="indexImpact"><?php echo ($Impact); ?></td></tr>
	</table>
	
	</td>  
<?php
}
?>

 </tr> 
</table>
</marquee>
</body>
</html>
 

Grover

macrumors member
May 14, 2004
48
0
If you don't mind not allowing the widths to float, you can try specifying a fixed width like:

Code:
    <table>
    <tr><td width="200" class="indexCallRef"><?php echo ($CallRef); ?></td></tr>
    <tr><td class="indexSystemName"><?php echo ($System); ?></td></tr>
    <tr><td class="indexImpact"><?php echo ($Impact); ?></td></tr>
    </table>

You could also try:

Code:
    <table>
    <tr><td nowrap class="indexCallRef"><?php echo ($CallRef); ?></td></tr>
    <tr><td nowrap class="indexSystemName"><?php echo ($System); ?></td></tr>
    <tr><td nowrap class="indexImpact"><?php echo ($Impact); ?></td></tr>
    </table>
 

edesignuk

Moderator emeritus
Original poster
Mar 25, 2002
19,233
2
London, England
CanadaRAM said:
E, is there a reason you are not defining a cell width or table width for each of the entries?
Because I don't know what they will be. They change depending on how much text is pulled from the database.

ThunderLounge said:
Fix the width, and hide the overflow.
Again, I appreciate the help, but if you know how this is done would you be able to give a little more insight in to how exactly I do this?
 

edesignuk

Moderator emeritus
Original poster
Mar 25, 2002
19,233
2
London, England
Grover said:
You could also try:

Code:
    <table>
    <tr><td nowrap class="indexCallRef"><?php echo ($CallRef); ?></td></tr>
    <tr><td nowrap class="indexSystemName"><?php echo ($System); ?></td></tr>
    <tr><td nowrap class="indexImpact"><?php echo ($Impact); ?></td></tr>
    </table>
That fixed it. Thank you so much!
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.