Daily Deal Header Layout

[Toymaster]

I'm trying to recreate the right part of the header on www.diaperjunction.com. I really like how the daily deals and the cart are part of the right side of the header which is similar to mine currently. I've been unsuccessful in recreating this effect. Any help on this would be greatly appreciated.

[celebra1]

From the generated source I see:

<table width="287" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td align="left" valign="top">
<div class="topright_tile">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td bgcolor="#FFFFFF"><table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td width="47"><img width="45" height="35" alt="View your shopping cart" src="assets/templates/diaperjunction/images/shop-cart.png"/></td>
<td class="cart-text"><a href="view_cart.asp">SHOPPING CART</a>: 0 item(s) / $0.00</td>
</tr>
</tbody></table></td>
</tr>
<tr>
<td align="right" valign="top" id="topmenu"><a class="topMenu" href="contact-us.html">CONTACT US</a> | <a class="topMenu" href="myaccount.asp"> MY ACCOUNT</a></td>
</tr>
</tbody></table>
</div>
<div class="topright_btm"/>
</td>
</tr>
<tr>
<td align="left" valign="top">
<div class="topright_top"/>
<div class="topright_tile" id="dealcont">
<iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 272px; height: 69px;" src="dailydeal_widget.asp"/>
</div>
<div class="topright_btm"/>
</td>
</tr>
</tbody></table>

When looking at the css:

.topright_tile {
background-image: url(../images/topright_tile.png);
background-repeat: repeat-y;
width: 272px;
padding-right: 8px;
padding-left: 7px;
padding-top: 4px;
}
#dealcont {
position: relative;
height: 55px;
}
As you can see, there is an iframe involved, an ID and a class. The class has an image associated with it. These are your clues.

[Toymaster]

From the generated source I see:

<table width="287" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td align="left" valign="top">
<div class="topright_tile">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td bgcolor="#FFFFFF"><table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td width="47"><img width="45" height="35" alt="View your shopping cart" src="assets/templates/diaperjunction/images/shop-cart.png"/></td>
<td class="cart-text"><a href="view_cart.asp">SHOPPING CART</a>: 0 item(s) / $0.00</td>
</tr>
</tbody></table></td>
</tr>
<tr>
<td align="right" valign="top" id="topmenu"><a class="topMenu" href="contact-us.html">CONTACT US</a> | <a class="topMenu" href="myaccount.asp"> MY ACCOUNT</a></td>
</tr>
</tbody></table>
</div>
<div class="topright_btm"/>
</td>
</tr>
<tr>
<td align="left" valign="top">
<div class="topright_top"/>
<div class="topright_tile" id="dealcont">
<iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 272px; height: 69px;" src="dailydeal_widget.asp"/>
</div>
<div class="topright_btm"/>
</td>
</tr>
</tbody></table>

When looking at the css:

.topright_tile {
background-image: url(../images/topright_tile.png);
background-repeat: repeat-y;
width: 272px;
padding-right: 8px;
padding-left: 7px;
padding-top: 4px;
}
#dealcont {
position: relative;
height: 55px;
}
As you can see, there is an iframe involved, an ID and a class. The class has an image associated with it. These are your clues.

I definitely should have been more precise in my original question. What I'm really looking for is how to re-create the widget they are using on their site. I like how that widget fits under their cart function and showcases the actual product for the daily deal.

[MissHTML]

The previous post gave you the code. You have to just reposition the daily deal widget and change the layout which you'll find in your ftp. Then reupload the frame file with the new positioning and the new daily deal template so the layout is changed accordingly.