Help Needed: Tables Formatting tables to get what you want

[everydaysushi 0]

Hi all!

 

I was trying to use (invisible) tables in the design of my site. I have an image that I would like to be placed statically on the right, since it is a point of reference for the rest of my site. I then have a header image that I wanted to be at the top of the page, running up right next to the static image on the right. The lower-left hand corner of the page is the dynamic part, where all the action happens. It's not as small a space as it sounds, don't worry. But my problem is, I can't get the tables to work out the way I want.

 

Is there a way to FORCE a row height? I know when using frames, you can do like "50,*" meaning the first frame will be 50 pixels height/width (whichever you specify) and the * represents the remaining pixelage. But can you do that with tables? I tried messing around with it but it's just not working out the way I want.

 

It could be because the image is not aligning to the very TOP of the table. Or the table itself is not aligning to the very TOP of the screen.

 

If anyone could shed some light on this, I'd greatly appreciate it!!

[renshs 0]

If you are using dreamweaver mx 2004 it could be easy.i would put a frame in "right and nested top frame". This would allow the image to go to the top right corner. the frames can also be alterd at will. if you wanted to have that image there all the time you could set all links to open in the main frame nd only have what would be there in there.

[SingleDaddyof2 0]

...Is there a way to FORCE a row height?....

<{POST_SNAPBACK}>

The table row tag <tr> only accept the "align" and "valign" attributes. Table data cell heights can be controlled through the use of CSS (involves the "padding", "margin" and "border" properties). There are many fine CSS online tutorials. Here's a link to one of them:

 

http://www.w3schools.com/css/default.asp

 

You can also enter "CSS tutorial" into your favorite search engine to find more. Hope that helps!

[miCRoSCoPiC^eaRthLinG 0]

Asa singledad pointed out you can achieve this by using CSS attributes. If you redefine the <td> tag or simply create a style class and assign that to the <td> it'll inherit the properties of that style class .

Let me give you an example....

Inside a separate stylesheet file or main html body...===================================.mytd {    width: 10px;    height: 10px;    .....    ..........}Inside HTML file============<table><tr>..............<td class="mytd">All contents go here</td>......</tr></table>

The example you see above creates a style class with row and height both set to 10 pixels. When you assign this class to your <td> tag, as seen in the latter part of the code, that particular cell will inherit the properties defined in mytd. Thus it'll resize itself to whatever height and width you'd specified in the mytd class.

Hope this helps

[everydaysushi 0]

Thanks everyone for your help. Yes, it would be a lot easier with Dreamweaver... But I don't have it right now. It's hard to realize I'm a bit helpless without it! That's a bad sign! I've tried learning CSS in the past. It seems simple at first, then daunting. The way "microscopic" puts it, it seems understandable. Can I try a little test myself? Just rename a TXT file with .css extension? Realize that I only have Notepad to play with (for now)! This is a good exercise in learning though.I will research some more CSS via the link. Thanks again!PS. I believe you can adjust cellpadding/border inside the <table> tag. Without CSS. Maybe "singledaddy" is talking about something even more advanced than that? Where each cell has its own attributes? ...Now *that* would be classy.

[vujsa 0]

Definitelty use CSS for this situation. As far as learning CSS, yes just change the file extention from .txt to .css.Start small and just keep adding to it. Don't fret about the lack of fancy editors. Many people use Notepad for web design. The program I use is just a basic text editor like Notepad that has a couple of features built in for HTML autocompletion.Also, be sure that you are editing your code with some kind of text-based editor for this kind of specific table creation. WYSIWYG editors tend to mis-format tables, so your background images won't line up. Another trick to getting your tables to line up correctly is to use a spacer image. Basically it is 1 pixel by 1 pixel and either the same color as the background or transparent. Then insert the spacer image into a table cell you have trouble with and set the width or height to be the size you want the table to be. The cell won't be samller than the specified image size. This doesn't work if the image doesn't load for some reason.I hope this helps. vujsa

[ChronicLoser 0]

I believe you can adjust cellpadding/border inside the <table> tag. Without CSS.

<{POST_SNAPBACK}>

Alright, if you want to do it without css, you can always do this:

 

<table>

<tr>

<td width="x" height="y">

content

</td>

</tr>

</table>

 

or you could also do this:

 

<table>

<tr>

<td style="width: x; height= y;">

content

</td>

</tr>

</table>

 

which is pretty much the same thing

[chiiyo 0]

How about using divs for your layout? I'm actually a table-layout junkie myself, but I've been trying very hard to comply with the whole presentation goes to CSS and data goes to HTML thing and learning how to use divs to create a layout instead of using tables.

Try http://www.htmldog.com/guides/css/intermediate/layout/ . I'm currently scouring through the page to try and find a way to convert my current table layout to a more XHTML compliant version...