FrontPage® 2000 FAQ


Home
About
FAQ
Links
Counters
Contact
Forum

Basic Design Questions

Netscape Positioning Problems

Whilst viewing your site using Netscape, you may find that your positioning looks very different to what you intended. This is because Netscape has a different set of rules, as far as some HTML is concerned. To avoid this problem, do not use absolute positioning as Netscape does not support it.

Also, try putting everything into tables, set the border size of the tables to 0 to make them invisible. Your content can then be positioned relative to the table, which Netscape handles better. This page (and indeed every page on this site), is within a table.

Alternatively, if you are feeling more adventurous, you could use CSS, although some CSS is not supported by Netscape. See the links page for sites that have tutorials on this subject.

Back to FAQ


Netscape Margins

When setting the border sizes for your pages, you may find that Netscape does not appear to take much notice of them. You will need to add a some settings in HTML view to do this in the <BODY> statement. 

For Example : The border settings for this page are set to zero, and look like this in HTML view:

<body topmargin="0" leftmargin="0">

but to make them compatible with Netscape, you will need to add "marginwidth" and "marginheight" settings too, as shown below :

<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">

Back to FAQ


Netscape with Transitions & Effects

Most DHTML effects and page transitions are NOT supported by Netscape browsers, although reports suggest that version 6 and upwards will.  The alternative would be to use java-applets or scripts to achieve the same effects. Check out the Links page for sites that include such effects.

Back to FAQ


Netscape with Horizontal Line & Border Colours of Tables

Netscape (4 and below) does not support horizontal line or border colours.  No matter what you do, they will always appear as the "horizontal line" example below.

There is a way around this, by using very small gif files (2x2 pixels) of the colour you require, stretched to the size you want, in image properties. The lines below show the differences

Horizontal line as viewed through Netscape

Gif file line as viewed through Netscape


Border colours of tables can't easily be done this way.  It is best to create a single celled table first, with borders, cell padding and cell spacing set to 0.  Then set the background colour of the cell of that table, to the colour you require the borders to be. 

Insert your table into the cell of that table, center it, and set the border size to 0. Set the width of the table to 100%, so that it always fills to the width of the table containing it.  Set the background colour of the cells to white (or what ever colour you want the table cells to be).

Now, here's the clever bit.  Set the cell padding and cell spacing of the inside table, to the thickness of the border you require.  Because the padding of the cells is always "transparent", the colour of the table below it shows through.  This, gives the appearance of a coloured border.

Unlike setting the border colours of tables in table properties, this method works with both IE and Netscape.

Product

Week

Cumulative

Socks

12

123

Shoes

10

101

Back to FAQ


Tables with Rounded Corners

This is a very common question, but the answer is a little different from what you may expect. 

Actually, tables are not able to do rounded corners, but it is possible to make them appear so.

This is usually done by creating images for the corners (and in the example below - the lines too), and putting them into outer cells of tables. 

The following examples do just that, the first being laid out with the border size not set to 0, so you can see how it is constructed.

It uses the images as cell backgrounds.  Do not try aligning cell background images, with images actually inserted into cells, as they align slightly differently in some browsers.

     
 

The gif files around the outside of this table are specified as cell background images.

This is so the lines themselves (not the corners) will "tile" when the table is resized in the browser.

 
     
     
 

This is what the finished product looks like, with the border size of the table holding it set to 0.

By using this method, you are only limited by your imagination and design skills, as to what your finished tables will look like.

 
     

Additional information

  • All the files used for the table corners and lines are gif files of 30 x 30 pixels.

  • The table's width and height properties are unspecified.

  • The cells holding the corners are set to a fixed size of 30 x 30 pixels.

  • The cells holding the horizontal lines are set to a height of 30 pixels, but their width is unspecified.

  • The cells holding the vertical lines are set to a width of 30 pixels, but their height is unspecified.

  • The height and width properties of the cell in the middle (holding the text), are unspecified.

Back to FAQ


Blue Borders Around Images

These borders appear when the image carries a hyperlink. The settings for these borders are in the properties of the image.  Right click the image and select "Picture Properties | Appearance".  Setting the "Border Thickness" to 0 turns this off, setting it to 1 or above, turns it on.

Back to FAQ


No Underline Links

This can be achieved though a little CSS in your <HEAD> statement of your HTML:

<style>
<!--
  a{text-decoration:none}
// -->
</style>

Can't be bothered to do this ? Want an add-in to do it for you ? Then see Jimco's Add-Ins.

Both solutions will stop every link on a page from being underlined. If you only want certain links with no underline, alter each link you require not to be underlined to :

<a style="text-decoration: none" href="http://www.mysite/mypage.html">My Link Text</style></a>

The items in Bold need to be altered to suit your needs.

Back to FAQ


Fixed or Resizable Pages ?

This is a matter of taste, but without going into detail or CSS, the consensus is to use of tables to hold the content, with the table border sizes set to zero to make them invisible.  

For Fixed Size Pages : Set the table width and height to a fixed pixel size. When doing this, I prefer to design for 800 x 600 screen sizes (as they appear to be the "lowest  common denominator" at the moment) which still looks good at 1024 x 768 and above.

For Resizable Pages : Set the table width to a percentage. This I have done with the table holding this page.  Notice, if you resize your browser, how the text wraps to fit.  

Please note that images in tables of this nature, do not resize.  This you will see if you look at the top image on this page, and reduce the width of your browser to less than that of the image.

Back to FAQ


Fixed Background Images

There are many ways to set this in FP, but by far the easiest method is to put one of the following lines in your <body> statement.

For fixed Images that are tiled

<body background ="images/yourimage.jpg" bgproperties="fixed">

This line will fix the tiled background image to the same place while the browser scrolls. The items in Bold need to be altered to suit your needs.  This does not work in Netscape 4 (or earlier) browsers.

For fixed Images Non-tiled

<body style="background-image: url('images/yourimage.jpg'); background-repeat: no-repeat; background-attachment: fixed">

The items in bold need to be altered to suit your needs.

Please note that this doesn't work in Netscape 4 browsers  (or earlier) either. Both solutions in Netscape 4 (or below) will display the background image, but without "fixed" or "non-tiled" attributes.

Back to FAQ


Back & Forward Buttons

Although there are perfectly good ones on the browser, there are occasions where you need them on your page too. To do this, simply paste this code in HTML view, where you want the button to appear.

<FORM>
<INPUT type="button" value="Back" onClick="history.go(-1)">
<INPUT type="button" value="Forward" onClick="history.go(1)">
</FORM>

Notice that the buttons are held within a form frame. Also, you may need to alter the format and alignment of these buttons to suit. These buttons will look like this :

You may think that these buttons are a little "bland", and may wish to use your own. To do this, you can create mouseover buttons as normal, and insert the lines below in the URL for each button:

Back Button URL : javascript:history.go(-1)

Forward Button URL : javascript:history.go(1)

If you are using frames then also remember to set the targets of the URLs accordingly. Here is an example of the two mouseover buttons that use this method :

BackForward

Please note : These buttons are Javascript based, and will not work in some earlier browsers. Neither will they work, if Javascript has been disabled by the user, in their browser settings.

Back to FAQ


Custom Bookmark Icons ("Favicons")

In IE5 you can customize the icon next to a bookmarked web site, to be your own customized icon. When people bookmarks your site, they will see your icon next to the bookmark. In earlier versions of IE, all icons next to bookmarks, looked like this ie logo. Now, thanks to "favicons", you can specify your own.

To learn how to do this see http://www.favicon.com/. Please note that these do not work with Netscape 4 (or below) browsers.

Back to FAQ


All products and company names mentioned herein are the trademarks of their respective owners.
Microsoft® and FrontPage® are registered trademarks of Microsoft® Corporation in the United States and/or other Countries.