html td background image

By webdev100 on 25 Oct 2014 at 16:00 UTC

Hi,

I am simply trying to have image as td background and have some text in the td cell.

Here I have the below code to have two td cells(1 row) with background image and some texts. I am getting repeating images with two texts.

How can i have two images(400 width each) with texts?

<table width='100%' border='0' cellspacing='1' cellpadding='0'>
<tr><td width = '400' background='../image1.jpg'>This is our text1 over the img</td>
<td width = '400' background='../image2.jpg'>This is our text2 over the img</td></tr>
</table>

Thanks.

-D

Comments

I am guessing you want width=

nevets commented 25 October 2014 at 16:24

I am guessing you want width='400px' (notice the px).

Also as a best practice, it is better to assign a css id or css classes to elements and then use a style sheet to apply the css

Definitely CSS would be

webdev100 commented 25 October 2014 at 19:45

Definitely CSS would be better. For now, I am just trying to fix it in html.

I did change width = '400' to '400px'. It did not solve it. Any help?

Thanks.

I think that using an

paean99 commented 25 October 2014 at 19:50

I think that using an external style sheet, as nevets mentioned, is the better approach.
Meanwhile place td { background-repeat:no-repeat; } in a css file or inline style="background-repeat:no-repeat;" in each of the td.

Thanks for help. I am getting

webdev100 commented 25 October 2014 at 21:35

Thanks for help. I am getting closer.

Now I have this code.

<table  style="background-repeat:no-repeat;"  cellspacing="0" cellpadding="1" border="0" background="../1.png">
<tr>   <td width="250" height="250"  align="center">This a text with image background</td> </tr>
</table>

If I save this code in notepad as html and run it locally, I get the result I want which is to display the text with the image background.

But If i run the same code in drupal (structure >block>add block > FULL HTML option is selected), the text is outside the image. I am lost

Please advise with html for now.

-D

In your latter example, you

paean99 commented 25 October 2014 at 21:55

In your latter example, you only have a td (with a 250 width).
Two questions. What is the size of your image? What theme are you using?
There may be other styles in conflict here. You should inspect the page with Firefox firebird or Chrome inspector.