1

[shakir]

shakir

#5114

I am using this theme since last 2 months but this is the first i needed to insert a image in a table.I took a image of of 383px width and 500px height and also took a td with the same width and height in a table.I took table with 0px border.Then i insert the image to that td but after publishing i see the image in bellow way:

And code of my table and image is bellow:

<table width="483" border="o" cellspacing="0" cellpadding="0">

<tr>

<td width="383" height="500"><img src="http://sitename.com/wp-content/uploads/2012/03/hello.png" alt="" title="hello" /></td>

<td width="100" height="500">hello</td>

</tr>

</table>

So now can anyone help me please how to get remove automatic space from the 4 side of the image and automatic border size?

[Kenneth John Odle]

Kenneth John Odle

#30705

Moved to Support. Please post in the correct section next time.

In your custom CSS or child theme css, define a special image class and apply it in your table.

CSS:

.imgshakir {

padding: 0;

margin: 0;

}

In your post:

<img src="http://sitename.com/wp-content/uploads/2012/03/hello.png" alt="" title="hello" class="imgshakir" />

You can name the class whatever you like, just be sure to make it something unique.

[shakir]

shakir

#30706

So if i will post 5 different image in 5 table then will I need to use 5 different code in custom css with the name of 5 image ?

[shakir]

shakir

#30707

And no it did not work fully.It only reduced the space size of top and bottom of the table but nothing happened in left or right side and also still now table border is showing.So any more way please?

[Kenneth John Odle]

Kenneth John Odle

#30708

Quote:

So if i will post 5 different image in 5 table then will I need to use 5 different code in custom css with the name of 5 image ?

No. You will apply the same class to all images.

Quote:

And no it did not work fully.It only reduced the space size of top and bottom of the table but nothing happened in left or right side and also still now table border is showing.

That’s probably because the table cells have some padding applied to them. You can add the same class to them, as well:

<td width="383" height="500" class="imgshakir" >

You can visit http://www.w3schools.com to learn more about how to control padding, margins, borders, and tables.

[shakir]

shakir

#30709

Thanks for your answer.I do not understand well about coding for that i can not find our the answer from w3school.You last solution helps me to remove space from 3 side now only in right side left.Can you help me to remove that in any way?please

[Kenneth John Odle]

Kenneth John Odle

#30710

Not without a link to your site. But you can use Firebug to isolate those codes and experiment. Josh has a good video tutorial here:

http://www.joshlobe.com/2011/10/using-mozilla-firebug-to-inspect-css-files/

[shakir]

shakir

#30711

http://freebrochuremaker.net/hello.html

that is the link

[Kenneth John Odle]

Kenneth John Odle

#30712

I just realized that you are using this code:

<td width="383" height="500" class="imgshakir" >

Since you are specifying the width of the table cell, if the image is not wide enough to fill it, there will be space left over. Try this code instead:

<td class="imgshakir" >

It is generally a bad idea anyway to add styling information to HTML. You should define your styles in your CSS and apply them as classes or ID’s in your HTML.

[shakir]

shakir

#30713

ok changed but now it takes more space.can i do some change in style.css?