Space under image in table

[verystrengt]

I made a table with 7 rows and 1 rowspan that has an image, but the image has a line under it that I don't want.
Here's a link to it

https://www.dropbox.com/s/trdtzk2mnnqzc31/oef3.zip?dl=0

thanks

[soybean]

Can put the html file containing the table on a web server and post a link to a web page? I was going to take a look at your table but I don't want to setup a Dropbox account just to do that.  This might be true for other forum members too.

[verystrengt]

http://weirdtable.net16.net/default.html

just learned how to upload a website

[soybean]

http://weirdtable.net16.net/default.html

just learned how to upload a website

Your link redirects to http://error404.000webhost.com/?   The reason probably is that you need to register a domain name and get it linked to your web server account before anyone can view the web pages you've uploaded.  I recommend godaddy.com for registering a domain name.

[verystrengt]

Your link redirects to http://error404.000webhost.com/?   The reason probably is that you need to register a domain name and get it linked to your web server account before anyone can view the web pages you've uploaded.  I recommend godaddy.com for registering a domain name.

No, my mistake, I changed the directory
the url now  is: http://weirdtable.net16.net/NetBeansProjects/Week3/public_html/oef3.html

[soybean]

I saw this element in your code:

Code: [Select]

}
            .lotr{
                height: 200px;
                width: 133px;

Try changing the height value to something greater than 200px.  Alternatively, test what would happen if you simply eliminate the height specification, or set it to 100% if that will work.

[verystrengt]

I saw this element in your code:

Code: [Select]

}
            .lotr{
                height: 200px;
                width: 133px;

Try changing the height value to something greater than 200px.  Alternatively, test what would happen if you simply eliminate the height specification, or set it to 100% if that will work.

The picture became bigger, but nothing else changed :/

[frederiek]

I would just go test and test....

You can see that you the border is shown because your image is going over the top tableborder.
Go test with some padding:0; for your td's, try margin: 3px the image.

Your image:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  >
should be:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  />

[soybean]

Your image:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  >
should be:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  />

The two lines of code you posted are exactly the same.

[verystrengt]

I would just go test and test....

You can see that you the border is shown because your image is going over the top tableborder.
Go test with some padding:0; for your td's, try margin: 3px the image.

Your image:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  >
should be:
<img src="pics/the-lord-of-the-rings.jpg" alt="lotr imagee" class="lotr"  />

an image end tag (/>) is no longer necessary in HTML5
margin:3px; moved the picture a little bit out of the table