I have a table with 1 row, and 3 columns. It's look like:
______________________
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
----------------------
The table has 940px width and 600px height. The first td and the last td should be the "container" sides. The web designer draw a concave - ) ( - PNG images for the sides. I must insert it with <img src""/>
, because if I put the image for background, the image doesn't stretches. The problem is with the height of the image. Because every page is dynamic, I can't define the table height, or the image height. Every page should have auto height, but the problem is with the sides. If I insert the image with height='100%', the page goes long to the bottom of the page, because it has 2000px height. I tried with height:inherit, but no result. How could I declare the image?
You can use a background image and add background-size: contain
or background-size: auto 100%
.