Position:absolute inside Position:Relative

phpkid · 12-01-2006, 05:21 PM

Hi guys, I posted this on the PHP forum and realized I asked in the wrong spot, Can you take a look? Thanks
PK

Quote:

Hey all, this is my first post in a long time... I've been a fan of this forum and hope you can all help me again like you have before. Here's my newest dilema.

I have a code. (relative code only)

PHP Code:


			
<link rel="stylesheet" href="index.css" type="text/css">

<table width="90%" border="0" cellpadding="0" cellspacing="0">

  <tr>

<?

$result = mysql_query("SELECT * FROM coupons"); //Selects from database



if ($myrow = mysql_fetch_array($result)) {

    do {

    $C_ID = $myrow["C_ID"];

    $name = $myrow["name"];

    $desc = $myrow["desc"];

    $exp = $myrow["exp"];



if ($pos == 3){?></tr><tr><? $pos = 1;}

$pos = $pos+1

?>

    <td width="38%">

    <div align="center" style="position:relative"><img src="images1152x864/coupon.jpg" width="293" height="233" /><br />

    <div align="center" style="position:absolute; top:8px; left:6px; width: 285px;" class="header2"><? echo $name; ?></div>

    <div align="left" style="position:absolute; top:55px; left:10px; width: 180px; height: 110;" class="desc"><? echo $desc; ?></div>

    <div align="center" style="position:absolute; top:185px; left:25px; width: 100px; height: 30;" class="exp"><? echo 'Expires:<BR>'.$exp; ?></div>

    </div>

    </td>

<?

    } while ($myrow = mysql_fetch_array($result));    

}

?>

  </tr>

</table>

This works fine in IE... However in Firefox it does not... any ideas how I can get this to work on both?

Thanks

PK

ahallicks · 12-01-2006, 05:24 PM

A link?

phpkid · 12-01-2006, 05:30 PM

I can't link to it, but basically, the absolute divs do not take to the relative container

harbingerOTV · 12-02-2006, 01:42 AM

Code:

    <div align="center" style="position:relative;border:1px solid #000;">
<div style="position:relative;margin:0 auto;background:#ccc;width:293px;">
<img src="images1152x864/coupon.jpg" width="293" height="233" /><br />
    <div align="center" style="position:absolute; top:8px; left:6px; width: 285px;background:#fdd;" class="header2">1</div>
    <div align="left" style="position:absolute; top:55px; left:10px; width: 180px; height: 110px;background:#36f;;" class="desc">2</div>
    <div align="center" style="position:absolute; top:185px; left:25px; width: 100px; height: 30px;background:#d6c;" class="exp">3</div>
</div>
    </div>

IE will center anything. wrap all that stuff in another div and give it a width and aplpy margin: 0 auto and the oother browsers will play along.

phpkid · 12-02-2006, 02:32 AM

Thank you very much. I would have never thought about adding another DIV

PK