Site Streching issue.

[Cenron]

Hey guys I dont mean to double post but I was told to come to this forum to ask about this problem.

 

Every time I add content that is bigger then the table it stretches everything out Ill show you and example.

 

I want it to stretch at the bottom like this one does....

 

http://www.the-leg.net/

 

but when I try it I get this

 

http://mentalgauge.com/testarea/clancms/index.php

 

Notice how all the images in the table stretch on the left and right side.

 

and real funny thing is...IE and FIREFOX mess it up but DreamWeaver displays it correctly.

 

HELP please I am totally confused...i been working on this for like a week.

 

The second post can be found here

 

http://www.phpfreaks.com/forums/index.php/topic,152319.0.html

[zipp]

try this on your table tag.

 

<table style="min-width: 300px; max-width:300px;">

 

where 300px is the width you want the table to be.

[Cenron]

try this on your table tag.

 

<table style="min-width: 300px; max-width:300px;">

 

where 300px is the width you want the table to be.

 

 

Well width isn't really the problem....my problem is the actual height because the images don't stretch but the table does.

[TheFilmGod]

I didn't even look at the source. Or at the webpage.

 

I'll tell you words of wisidom. Dreamweaver acts a lot like IE where it causes undefined heights to stretch from float child elements. Or some other tables improperly. Just because it does it right in dreamweaver and not in the browsers is one of those times...

 

You need to start from scratch and start from the problem area. Don't worry, you already got most of it done. Just start from new and get the trouble areas correct to work in the browsers and then start adding content. I think its crazy to pimp out fonts and put in background colors/images while your basic code doesn't even work in IE or other browsers!!

 

I will look at the code more closely when you strip away not needed colors and background images. A.K.A - semantic code.

[Cenron]

I didn't even look at the source. Or at the webpage.

 

I'll tell you words of wisidom. Dreamweaver acts a lot like IE where it causes undefined heights to stretch from float child elements. Or some other tables improperly. Just because it does it right in dreamweaver and not in the browsers is one of those times...

 

You need to start from scratch and start from the problem area. Don't worry, you already got most of it done. Just start from new and get the trouble areas correct to work in the browsers and then start adding content. I think its crazy to pimp out fonts and put in background colors/images while your basic code doesn't even work in IE or other browsers!!

 

I will look at the code more closely when you strip away not needed colors and background images. A.K.A - semantic code.

 

 

Well it dosent seem to matter what the code is it always streches

 

Here is just some basic code and still gives me the same problem

 

 

HERE IS A PAGE OF THE STRIPPED DOWN CODE: http://mentalgauge.com/testarea/temp/test.html

<table cellpadding="0" cellspacing="0" border="1">
       <tr>
           <td colspan="3"><img src="images/cutmy111_07.gif" /></td>
       <tr>
       <tr>
           <td><img src="images/cutmy111_24.gif" /></td>
           <td rowspan="3" width="500" valign="top">
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT
           CONTENTCONTENTCONTENTCONTENTCONTENTCONTENT

           </td>
           <td><img src="images/cutmy111_24.gif" /></td>

       </tr>
       <tr>
           <td><img src="images/cutmy111_27.gif" /></td>
           <td><img src="images/cutmy111_27.gif" /></td>
       </tr>

       <tr>
           <td><img src="images/cutmy111_43.gif" /></td>
           <td><img src="images/cutmy111_43.gif" /></td>

       </tr>

</table>

[Philip]

Okay, slow down here, let's try to fully explain the problem:

 

Why part is stretching? The tables around the images on the left and right columns, correct?

 

There is an attribute for table height (simply height="XX" - where x = # of pixels), however it really isn't the best option. I would suggest picking up some CSS and trying it out possibly, because even though you've done a lot of work now, it's going to pay off in the long run whenever you want to change something, or add something. I was the same way, always used tables, but once I used CSS once, I never went back.

 

If you're wanting to stick with tables, why not combine the 2 images in the same <td>?

(these 2):

http://mentalgauge.com/testarea/temp/images/cutmy111_24.gif

http://mentalgauge.com/testarea/temp/images/cutmy111_27.gif

 

then have one in between those that does have an auto height, where the background is black.