Jump to content

No Repeat Cell Background


makeitspiffeh
 Share

Recommended Posts

So I have this background for this table. It's an image that I do not want to repeat no matter how large the table is. Here's the table code as of right now.

<table border="0" width="100%" height="100%" cellpadding="4" cellspacing="1">  <tr>    <td width="41%" height="22"><img src="images/test.gif"></td>    <td width="62%" height="22" background="images/itemdis.gif">     <font face="Trebuchet MS">     <b> ITEM NAME</b><br>      Price: $00.00<br>       <font size="2" color="#009999">Description:  Blah Blah Blah Blah Blah     Blah Blah Blah Blah Blah Blah Blah Blah  Blah</font></font><br>     <center><a href="link.htm">Link</a></center></td>  </tr></table>

Can someone modify that for me so itemdis.gif doesn't repeat.

Link to comment
Share on other sites

Change<td width="62%" height="22" background="images/itemdis.gif">to<td width="62%" height="22" style="background-image: url('images/itemdis.gif'); backgroundrepeat: no-repeat">Unless you want it for the entire table, in that case, change<td width="62%" height="22" background="images/itemdis.gif">to<td width="62%" height="22">and<table border="0" width="100%" height="100%" cellpadding="4" cellspacing="1">to<table border="0" width="100%" height="100%" cellpadding="4" cellspacing="1" style="background-image: url('images/itemdis.gif'); backgroundrepeat: no-repeat">

Edited by Sckewi
Link to comment
Share on other sites

Hi, remember to put your styles in separated css rules, like this

CSS#mytable{border:0;width:100%;height:100%;}.lefty{width:41%;height:22px;}.righty{width:62%;height:22px;background-image: url("images/itemdis.gif");font-family: Trebuchet MS;}.righty p{font-size:100%;color:#009999;}.boldy{font-weigth: bold;}.center{text-align: center;}

and

HTML<table cellpadding="4" cellspacing="1">  <tr>    <td class="lefty" ><img src="images/test.gif" /></td>    <td class="righty" >        <span class="boldy" > ITEM NAME</span><br />         Price: $00.00<br>                 <p>          Description: Blah Blah Blah Blah Blah          Blah Blah Blah Blah Blah Blah Blah Blah  Blah        </p>      <br>      <span class="center">        <a href="link.htm">Link</a>      </span>    </td>  </tr></table>

this code grows to do the same thing, but some classes can be used over and over again and even combined them, so class="center boldy" is going to center and bold all the text inside p, div, span, td, th, etc. tags.please avoid as much as you can the inline styles.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...