CraZy tables! Please help.

The cells that are green have a width of 100.

add width="100%" in td number 3 and/or test td
also when your content is in the main section (test td) it will push that cell out, when I'm setting up a page I always type . . . . about 100 times and about 20 this making the page fill.
the . . . should be dot space dot and extend more than the page width (continue on second line).
the should give you a little vertical scroll bar, this is the best way to make sure table alignments are good when using graphics for layouts.

Thanks Busy. The missing 100% helped get most of it back in order. But now check out charlottemlb.com/softball/crazy4.shtml . The only remainng table problem is the second and fourth columns now lost their widths. Each should be width=30 (noticable), but the violet column is only the width of "m" and the black column is the width of "4".

Oh, and now I'm just noticing that my total page width is now beyond the screen width because I'm now getting a scroll bar on the bottom.

Any other ideas?

Thanks.

P.S. Those were both some quick responses

I don't know how but I just got it!!! Thanks!!!

for the m & 4 columns use a clear spacer image the width of the gap you want

I see your using 0 margins but only a 95% table width, youd be better off using default margins and 90% table width.

make the top banner section, 3&4 and test sections percentage widths (or no widths) thus allowing it to fit multi size screens.

Quote: Originally posted by fifeclub
Also, notice that in the top there's a space below the title graphic, even though both the graphic and the height are identical (I'm using IE5.5). Why is this?

Make sure that the graphic has vspace="0" as well as hspace="0" if you are having problems horizontally

I'm back. Thanks to everybody's help I got most of my layout working. You can now see what I'm trying to do at charlottemlb.com/softball/home.shtml . The key focus is the area above the menu with black and green stripes, and the beveled edges that run across and down.

The layout seems fine in most of my pages (at least in my browsers) but the layout gets screwed up in my final two links ("Homerun Derby" & "About"). On all pages I use SSI to produce the layout table so it's exactly the same on every page. Now the reason these last two pages get screwed up is probably because I have no text that span across the entire page. What can I change in layout table code to prevent this dependence on full-width text (or gfx).

P.S. Thanks in advance AGAIN. You guys rock!

try add width="100%" in the td cell that holds the content in the about and homerun derby pages.

or even add a default is 100% but you could always state it as well

another way: looks like you have a black cell going under the header, (i didnt look in your code) if it is you can use the . . . . trick with font size 8px (style sheet) and black font, thus is hidden.

1st method is better

I put width=100% in the main td and it worked, but mysteriously (to me) causes an oversized page that puts a horizontal scroll bar along the bottom. So just for a trial I put 90% in thinking it would do some other wierd thing but it worke fine (in 800 x 600). I then tried 80% and the original problem came back.

Right now it's working with width=90% and no scroll bar appears. I don't know why, but can you (anyone) just let me know if my "90%" is causing problems on your screens. I can only see IE5.5 at 800 x 600 and it looks great so I'll just leave it alone and continue building content if nobody red-flags me with a table problem.

has problem in NS4.7 and Opera6 - try make that cell 99%
if that doesnt work take out the width="100%" in the 'table' tag and make the td tag 100%

ok in NS6 and IE5

Also just noticed your fonts, they appear differently in different browsers, having a font tag around a table doesnt generaly work, you need a font tag in each cell, an easier way is to use a style sheet, something like
td (color: ???; font-family: ?????; font-size:10px;} which sets all font in td cells to that.

Quote: Originally posted by Busy
has problem in NS4.7 and Opera6 - try make that cell 99%
if that doesnt work take out the width="100%" in the 'table' tag and make the td tag 100%

ok in NS6 and IE5

In my browser/resolution. 95% and up cause the scroll bar. I'd love to try your suggestion but I don't understand the difference between width=100% and make the td tag 100%. If that doesn't work I still haven't explored putting an hr tag along the bottom to open it up.

Quote: Also just noticed your fonts, they appear differently in different browsers, having a font tag around a table doesnt generaly work, you need a font tag in each cell, an easier way is to use a style sheet, something like
td (color: ???; font-family: ?????; font-size:10px;} which sets all font in td cells to that.

Yes. I definitely intended to use an external css to fix that and the problem with link colors in the main section. But I don't know anything about it so "learn external css" is on my to do list after I get other things in order. If I can quickly fix those links with the in-line css code you just listed above, that'll be easierr for me and I'll take my time to learn the external variety at a later time. You saved me once again! Thanks

THE DUGOUT - Charlotte Slow-Pitch Softball

a:hover{color:red;}
a{text-decoration:none;}

<script>
function stoperror(){
return true
}
window.onerror=stoperror
</script>

<script language=JavaScript>
http://walk.to/crash)
Submitted to and permission granted to Dynamicdrive.com to feature script in it's archive
For full source code to this script and 100's more, visit
http://dynamicdrive.com
*/

var message="Right-Click Disabled";
function click(e) {
if (document.all) {
if (event.button==2||event.button==3) {
alert(message);
return false;
}
}
else if (document.layers||document.getElementById) {
if (e.which == 3) {
alert(message);
return false;
}
}
}
if (document.layers) {
document.captureEvents(Event.MOUSEDOWN);
}
document.onmousedown=click;
// -->
</script>

1
2
3
4

LEAGUES
Home/News
Park & Rec
Other Leagues

PARKS
Parks Map
Clanton
Hornets
Nest
Idlewild
Nevin
Park Road
Renaissance
Revolution
W.R. Davie
Cherry

LINKS
Links

EXTRA INNINGS
Homerun Derby
About

m

test

© 2002 THE DUGOUT
[Beta v0.8]

4

Quote: In my browser/resolution. 95% and up cause the scroll bar. I'd love to try your suggestion but I don't understand the difference between width=100% and make the td tag 100%. If that doesn't work I still haven't explored putting an hr tag along the bottom to open it up.

width="100%" in the table tag makes the width of the table 100% wide, but doesnt have any control over your table cells (td's).
adding width="100%" into a td tag forces that cell to expand to maximum width, but has no control over the overall table width (if no table width is declared it will go to default, which is around 100% - browser margins do differ thou).

try the

First my apologies that this thread has gone on so long.

I've got two new test pages that I would like people to look at in different browsers and tell me if anything isn't working. The first is charlottemlb.com/softball/test.shtml This one is closest to what I was trying to do above. It looks fine to me in IE5 but the tables still go crazy in Dreamweaver.

The second is a desparation move. The top banner graphic which was colspan=3 was the cause of all my previous alignment problems, so I put it in it's own separate table. This trial can be seen at charlottemlb.com/softball/test2.shtml As the first example, this too looks fine in my IE5 but doesn't work in Dreamweaver.

There are a few potential problems with this design that I haven't seen in IE5.5 but are possible due to the fact that there are now two layout tables (top banner and everything else). One is that the widths of the two may appear independent (ex. when resizing, one section continues to condense width while the other scrolls off the side of the screen). The other potential thing to look for is that a thin line may sneak between the two tables.

Please let me know if you see any problems with either of these two layouts. Thanks again.

P.S. You can't see it in these examples but I learned enough CSS to make my menu links one color and my other links another color