Master Login
Username:
Password:
Client Login
Username:
Password:
Basic Updating Tutorials Editing Features Tutorials Advanced Tutorials

Using Borders

  1. Go to 'Website Design - Advanced Setup' on the menu.

    Each section of your web site in the advanced setup area has borders that can be changed independently from the next. This gives you lots of options to personalise your site style. The image below shows where each section displays its borders.

    Web site borders

  2. Go to the section that you want to edit in the Advanced Setup area. Each section has 3 options that you can change to alter your border.

    Border settings
  3. Border Style
    The style determines what type of pattern the border displays. The standard options are - None, Solid, Dotted or Dashed. Select the style you want from the drop down menu.

    Border styles

    User Defined Options
    You will see an option called 'User Defined' on the drop down menu. When you select this option you will see a blank box open up below the Border Style box. Here you can settings that don't appear on the standard list. You can't just enter anything, browsers display certain styles depending on the word inserted. Other styles you can enter in the User Defined box include – double, groove, ridge, inset and outset. Use lowercase text to enter these settings.

    user defined border styles

  4. Border Colour
     Here you can use the colour picker to choose the colour that you want your border to display.

    Other Options
    You have the option to enter your own colour reference by inserting the details into the box.

  5. Border Width
    This setting determines how thin or thick your border will display. When you first come to edit the width setting it will be displayed as;

    '0px 1px 1px 0px'

    The numbers will vary but the format will be the same, a number followed by 'px'. Each '0px' controls a different side of your border. It works like a clock. The first number is at the top, the second is the right, the third is the bottom and the forth is the left side.

    The diagram below demonstrates how this works.

    how borders work

    Each side can be set to a different thickness by entering a different number as the image illustrates. You can also set a number to zero and it will stop the border on the corresponding side from displaying.

    Other Options
    If you find this a little complicated you can simply type in a word that will display the thickness. Using this method you will not be able to control each side of the border separately. In the width box you can type any of these words – thin, medium or thick. All sides of the border in that section will display the width you have entered.

  6. Go to each section that you want to edit and repeat the above steps to create the look you want.

  7. Click submit to save your changes. Click on view website link at the top right of the page to view your changes online.

    8. DON'T FORGET It's important to keep checking your site and refreshing the browser to see your changes as you work.


Removing Borders

  1. Go to the section that you want to remove the borders from.

  2. Replace the settings with '0px 0px 0px 0px' or if you have entered a word replace it with 'none'.

  3. Click submit to save your changes. Click on the view website link at the top right of the page to view your changes online.

Also see:
View PDF Open PDF Help Sheet
Watch Video Tutorial Watch Video Tutorial