Resizing table cell
-
Hi, ive got a image which I want to use sort of like a window in windows or linux(where theres borders around the sides with a title bar at the top and they all stretch around acording to the size of the content in the middle. Heres an example of the box with borders so you can see what I mean. The big middle one is where the content should go. But what would the correct HTML and CSS for it to all stretch right? Please take a look at the image and at my current code below: <a href="http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg">http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg</a>[<a href="http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg" target="_blank" title="New Window">^</a>] <code><div id="test" style="width:300px; height:400px; position:absolute; background-color:Red; top:100px; left:100px;"> <table style="width:100%; height:100%;" cellpadding="0" cellspacing="0"> <tr> <td style="width:31px; height:29px;"> <img src="themes/topleft.png" alt="" /> </td> <td> <img style="width:100%; height:29px;" src="themes/topmiddle.jpg" alt="" /> </td> <td style="width:31px; height:29px;"> <img src="themes/topright.png" alt="" /> </td> &nb
-
Hi, ive got a image which I want to use sort of like a window in windows or linux(where theres borders around the sides with a title bar at the top and they all stretch around acording to the size of the content in the middle. Heres an example of the box with borders so you can see what I mean. The big middle one is where the content should go. But what would the correct HTML and CSS for it to all stretch right? Please take a look at the image and at my current code below: <a href="http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg">http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg</a>[<a href="http://img269.imagevenue.com/img.php?image=15336\_examplebox\_122\_143lo.jpg" target="_blank" title="New Window">^</a>] <code><div id="test" style="width:300px; height:400px; position:absolute; background-color:Red; top:100px; left:100px;"> <table style="width:100%; height:100%;" cellpadding="0" cellspacing="0"> <tr> <td style="width:31px; height:29px;"> <img src="themes/topleft.png" alt="" /> </td> <td> <img style="width:100%; height:29px;" src="themes/topmiddle.jpg" alt="" /> </td> <td style="width:31px; height:29px;"> <img src="themes/topright.png" alt="" /> </td> &nb
roguemat wrote:
It seems to work ok without the central image. But not with it.
I think the central image is taking a lots of spaces. Why dont you put it in fixed width and height so that you can change it whenever you are changing the width of td.
Abhishek Sur **Don't forget to click "Good Answer" if you like this Solution.
My Latest Articles-->** Simplify Code Using NDepend
Basics of Bing Search API using .NET
Microsoft Bing MAP using Javascript -
roguemat wrote:
It seems to work ok without the central image. But not with it.
I think the central image is taking a lots of spaces. Why dont you put it in fixed width and height so that you can change it whenever you are changing the width of td.
Abhishek Sur **Don't forget to click "Good Answer" if you like this Solution.
My Latest Articles-->** Simplify Code Using NDepend
Basics of Bing Search API using .NET
Microsoft Bing MAP using Javascript -
Then let me know what exactly the problem is. If you use Tables, it tends to increase the percentage size of a cell if the content exceeds the limit, if not defined with Fixed width and height. So if the layout is not exactly what you want, you might use Divs to create the same layout with appropriate css. :)
Abhishek Sur **Don't forget to click "Good Answer" if you like this Solution.
My Latest Articles-->** Simplify Code Using NDepend
Basics of Bing Search API using .NET
Microsoft Bing MAP using Javascript
