GeoSearch CSS Tutorial

Changing the Fonts

Once you know how to create a style section and add CSS declarations, changing the fonts displayed in GeoSearch is a snap.

CSS Font Attributes

The following is a list of the different font-related attributes that you might wish to change:

• font-family: serif, sans-serif, cursive, fantasy, monospace
• font-size: large, medium, small, 1.1em, 10px
• color: green, blue, etc.

For more information on CSS font attributes, see the CSS Font and Text Style Wizard , brought to you by www.somacon.com

CSS Declaration

There are two distinct classes of text that we might want to change:

• Link Text: The hyperlinks
• Free Text: All other text

..and we can either make these changes in the:

• List Div: Will affect text and links in the result items and elsewhere in the list div.
• Map Div: Will affect text and links in the popups and elsewhere

We'll show here the font changes as applied to the list div:

    /* Link Text */			
    #list a { 
        font-family: cursive;
        color:orange;
    }		

    /* Free Text */
    #list div { 
        font-size: 20px;
        font-family: monospace;
        color:red;
    }

Note that by changing the two occurrences of #list to #map the above font changes would be applied the map instead.

This example shows GeoSearch with font-modified CSS.