HTML Table Problem

Hi,

Would someone be so kind as to advise me why my 2 images aren't showing up (I'm sure they ARE jpg's) and why I am unable to make the word "Bavaria" bigger? It seems so small in the center.

I would like to have the words, "Bavaria" and then "Germany" right underneath of Bavaria in the center of the table, but I can't seem to even figure that out. <sigh>

I would really appreciate any help you might be able to give me. I'm a real novice with creating a page from scratch with html. :-(

http://www.bavariagen.com/index.html

If you can't reach the page (my browser couldn't locate the server today, now it can however the lozenge background doesn't show up in Netscape but does in IE), this is the code:

<HTML>
<HEAD>

<TITLE>Bavaria World GenWeb Homepage</TITLE>
</HEAD>
<BODY BACKGROUND="blue lozenges2.gif">

<table border="0" cellspacing="2" width="700" valign="top" align="center">
<tr>
<td><img src="GenWeb Logo.jpg" height="100" width="100"></td>
<td><b><font face="Kunstler Script, ariel" size="20" color="3399ff">Bavaria</font></b></td>
<td><img src="BavariaCOA.jpg" height="100" width="120"></td></tr></table>

</HEAD>
</HTML>

I definitely don't understand why Netscape won't at least show the gif background while IE does.......

I would really appreciate it if someone could tell me what I'm doing wrong here to cause these problems / not achieve what I'm trying to do.

Thanks so much!
Joanne

Joanne,

I can reach your page. The background shows up in Mozilla 0.9. Maybe older versions of Netscape can't handle file names with a space in the middle? Seems like I ran into that before.

Are you sure the other images, GenWeb Logo.jpg and BavariaCOA.jpg, are actually stored in your home directory on the server? It looks like the files are not found, and I cannot view them directly either (i.e. for http://www.bavariagen.com/BavariaCOA.jpg, I get 404 not found error).

Ah, I now see a problem. Your images on the server have upper case suffixes (i.e. .JPG), but your HTML uses lower case (.jpg). The server linux system is case sensitive. You need to either change your HTML to use upper case JPG, or re-name the files to lower case jpg.

Bob

ARDCO Templates by QuiltSmith, Ltd.
http://www.ardcotemplates.com/
Mens et Manus (personal)
http://www.mensetmanus.net/

Thank you so much, Bob! :-) I removed the space in the bluelozenges2.gif and capitalized the two jpg's and now I see everything with both IE and Netscape. I would not have recognized those two problems in a zillion years.

Now I can move on to my next problem <g> which is the trouble with the table.

Thanks again,
Joanne

i think i know what you wanted with "Bavaria" and "Germany", and i think i got your tables fixed, them being centered anyway.

example code:

<div align="center">
<table border="0" cellspacing="2" width="700" valign="top">
  <tr>
    <td align="center">
      <img src="http://www.bavariagen.com/GenWebLogo.JPG" height="100" width="100">
    </td>
    <td align="center">
      <b><font face="Kunstler Script, ariel" size="20" color="3399ff">Bavaria</font></b>
      <br />
      <b><font face="Kunstler Script, ariel" size="20" color="3399ff">Germany</font></b>
    </td>
    <td align="center">
      <img src="http://www.bavariagen.com/BavariaCOA.JPG" height="100" width="120">
    </td>
  </tr>
</table>
</div>

the sample is also using your current fixed on from your web site. enjoy.

Hi Monk,

Thanks so much for taking the time to do that for me, I appreciate it very much (and I've gotten the changes online). I've learned a lot lately. I will study it to try to understand what is happening there with the additions you made.

Might you know, is there a way for me to make the Bavaria Germany text prominent between the two images on the page? So that it will show up as a noticeably greater size (but not huge) than the two images it nests inbetween? So it will be slightly more spatially appealing to the eye (ex. small, bigger, small)? You might have noticed that I put size"20" for the font, but I don't think it really is. I can make it tiny ("3", "4"), but it seems that after a certain point (maybe "7" or around there), it won't get any bigger.

Thanks again for the help you've already given me.

Joanne

use style scripting, i think it works much better than the font commands. insert this right below the body command:
<style>
  .headertext {
    color: #3399ff;
    font-size: 50pt;
    font-weight: bold;
  }
</style>

now change the table domains(or cells, <td>) that has the text in it you want larger. example:
    <td align="center" class="headertext">
      Bavaria
      <br />
      Germany
    </td>

to adjust the font size just change "font-size: 50pt;" to a larger or smaller number.

hope this helps.

Edited by Monk on 07/23/01 11:52 AM (server time).

Hi Monk,

I've done what you said and I think it works very well on the page. I, of course, did not realize that to do it this way was even an option.

Thank you!

Joanne

Joanne...

Monk's suggestion is a good one; styles do offer more accurate control.

I'd offer one caveat, though: be careful when specifying smaller point sizes; fonts display differently on different systems. There's a fairly common problem that occurs when IE/PC page builders use small point sizes, but don't check the look of the page on a Mac before release-- and the small fonts are crushed (like a grape!) and unreadable many machines on the Mac side.

For example, in these DH message boards... In the "front page" -- the list of forums -- the descriptions have this problem on my machine. Can't read a one.

At the smallest sizes, you may want to use a "relative" size rather than points.

Have fun!

...Bob W.

yes, as bob_w has reminded me this does cause some concern on some browsers. there are also a variety of different size types you can choose from. a few examples i have listed below. but as a general rule i try to make pages that are compatible with the most common browsers used. as much as we would like, you can't make em all happy. frown

some examples would be: cm, em, ex, in, pc, pt, px

the ones that are bolded are the common ones used. if all else fails just leave off the extension, the ones above, and just enter a number in the font-size: ##; style command and it will work as the regular <font size="##" > command.

there are many other combinations and styles to format your page to adapt to other browsers. i would highly recommend actually looking into the css scripting and get a general idea of everything it offers. i'm just throwing out the general basics.

“To learn all good things would be to learn nothing has value.” -Galious