1

I'm creating a wordpress page and creating a certain part with background image, The main issue was, one of the image in css is being cut or split here is the link to the site:

http://testpress.dramend.com/amend-2/ the image being split was loopmid.gif which was not connecting to looptop.gif here is the screenshot:

enter image description here

<tr>
   <td height="23"><img width="707" height="23" alt="" src="http://dramend.com/looptop.gif"></td>
</tr>

Have I done anything wrong in my CSS?

Thanks

Mr. Alien
  • 153,751
  • 34
  • 298
  • 278
Dek Dek
  • 101
  • 1
  • 2
  • 10

4 Answers4

7

You need to use display: block; or you can use vertical-align: bottom; as well for the img tag since it is inline element by default...that will solve the issue.

Also, you are using table for designing layouts which is just dirty.. Learn CSS Positioning, floats, and make layouts using other tags like div, section etc

Mr. Alien
  • 153,751
  • 34
  • 298
  • 278
  • 1
    Thanks Mr. Alien works like a charm! will keep note of that! Thanks again! It helps a lot – Dek Dek Jan 09 '14 at 07:26
  • I have another css question on the same site I've asked, any chance to read my question here http://stackoverflow.com/questions/21015950/css-background-image-to-be-boxed-white-not-fullwidth Thanks – Dek Dek Jan 09 '14 at 09:18
0

Instead of using table for design, try using div and CSS Positioning

Nemeth
  • 166
  • 1
  • 1
  • 11
0

Since you are using table for designing layout, which is not suggested as Mr.Alien said, you may use display:table; for that img tag as well.

Green Wizard
  • 3,507
  • 4
  • 18
  • 29
0

In your css file please add following lines:

table, td, tr {
   margin:0; 
   padding:0;
}
Mr. Alien
  • 153,751
  • 34
  • 298
  • 278