Hey,
I got a really cool custom layout made for me on photoshop and I am slowly sticking it together with css and some tables here and there. Now everything looks perfect in Firefox 2 but in Internet Explorer 7 it doesn't.
I have uploaded the images from each browser:(Click on the images to enlarge)
Firefox 2:
Internet Explorer 7:
As you can see in IE 7 the middle image that is repeated is too high.
Here is the code:
I have tried adding "padding-top: 2px;" and "margin-top: 2px;" to the .bar class but no good. Does anyone have any ideas please they would be so appreciated. Thanks.
I got a really cool custom layout made for me on photoshop and I am slowly sticking it together with css and some tables here and there. Now everything looks perfect in Firefox 2 but in Internet Explorer 7 it doesn't.
I have uploaded the images from each browser:(Click on the images to enlarge)
Firefox 2:
Internet Explorer 7:
As you can see in IE 7 the middle image that is repeated is too high.
Here is the code:
| Code: |
|
/*CSS*/ .bar{ background: url('images/bar_bg.gif'); background-repeat: repeat-x; font-family: 5x5; font-size: 11pt; color: #1a3e50; } |
| Code: |
|
<!--HTML-----> <center> <table style="padding-top: 2px;" align="center" width="412" cellpadding="0" cellspacing="0" border="0"> <tr valign="middle"> <td align="left" width="4"><img src="images/left_bar.gif"></td><td align="center" class="bar" width="407">News</td><td align="right" width="4"><img src="images/right_bar.gif"></td> </tr> </table> </center> |
I have tried adding "padding-top: 2px;" and "margin-top: 2px;" to the .bar class but no good. Does anyone have any ideas please they would be so appreciated. Thanks.
