Help: Dreamweaver nooob

[iggypop]

So I'm building a website for one of my classes, but since it isn't a computer class we aren't given much direction in dreamweaver. Hoping you guys can give me a hand with 2 quick questions.
Here is a screen shoot for reference:



2 questions:
1. How do I get the large lawn image to fill the entire cell, rather than have some grey area below it. Make it a background, or something? I can't figure it out
2. More importantly, how do I "lock'' the table cells dimensions. When I delete the Lorem Ipsum text, everything gets really screwed up, like so:




Any help would be great! TIA

[getbak]

1:

I wouldn't want to have that image repeat because it'd be a sharp change from the green of the grass back to the blue of the sky. What I'd do there, if you have Photoshop or something similar (if you have Dreamweaver you should at least have Fireworks), is make the bottom of your image gradually fade to solid dark green colour, then set the background colour of your cell to that green colour. It'd be similar to what the CP page does at the top where it gradually goes from red to black, then is black the rest of the way.


2:

You should be able to set your table cell sizes to exact values that match the size of the graphics you have inside them, then set the one cell that you want to fill in the rest of the page to width="100%" and height="100%", which should force it to push all of its white space right up against the defined cell sizes.

So, if your photo is 200px wide and the "Contact Us" graphic is 100px high, your code would look something like:

<tr>
<td width="200px" rowspan="2">photo</td>
<td height="100px">CONTACT US</td>
</tr>
<tr>
<td width="100%" height="100%">Page content</td>
</tr>

[iggypop]

Originally Posted by getbak

1:

I wouldn't want to have that image repeat because it'd be a sharp change from the green of the grass back to the blue of the sky. What I'd do there, if you have Photoshop or something similar (if you have Dreamweaver you should at least have Fireworks), is make the bottom of your image gradually fade to solid dark green colour, then set the background colour of your cell to that green colour. It'd be similar to what the CP page does at the top where it gradually goes from red to black, then is black the rest of the way.


2:

You should be able to set your table cell sizes to exact values that match the size of the graphics you have inside them, then set the one cell that you want to fill in the rest of the page to width="100%" and height="100%", which should force it to push all of its white space right up against the defined cell sizes.

So, if your photo is 200px wide and the "Contact Us" graphic is 100px high, your code would look something like:

<tr>
<td width="200px" rowspan="2">photo</td>
<td height="100px">CONTACT US</td>
</tr>
<tr>
<td width="100%" height="100%">Page content</td>
</tr>

Took me a long time to figure out what you meant by your first answer but that does make sense. I just thought I should be able to have the image stretch fill the cell (not repeat the image) and thus I wouldn't need to do what your saying.

As for the second, my code looks like this:

<td height="98" colspan="3" align="right" valign="bottom" bgcolor="#FFFFFF"><p align="right"><img src="ContactUsHeading.JPG" width="483" height="96" /></p></td>

So my td height and image height are almost the exact same, yet it automatically drops the cell like you see in the second screen shot. The only other code for the table is as follows:

<table width="950" height="816" border="1">

But that is for the entire table, not individual cells.

[getbak]

No, you can't make the image stretch. Well, you can, but it's a lot more complicated than I assume you want to get into. A background image will tile by default, but you can tell it to not repeat if you use CSS.


Under the code you posted (which is for the cell with the Contact Us graphic) there should be another <td> cell. It should be empty right now, and would formerly have held the Lorem Ipsum text. If it's not there, that would be one problem. That is the cell that you should set to 100% height and width to force everything else to sit where you want.

[iggypop]

Got it!

I actually did get it to stretch into the cell. Well its actually squished into the cell, but it fills it perfectly and I'm really not concerned about slight image distortion in a simply page like this.

I also got that the code to work with the 100% height and width for the other problem. Looks way better.

Awesome, thanks a lot getbak, your help is very appreciated!