Announcement

Collapse
No announcement yet.

Navigation Buttons in Locomobilia.com

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Navigation Buttons in Locomobilia.com

    Hi Folks,

    I would really appreciate your help in advising me how to space out my top level navigation buttons - home/search etc. Currently I feel that they are too close together. Any help would be most appreciated.

    http://www.locomobilia.com

    I've searched the AUG and HELP but to no avail as yet.

    Regards, Piersland

    #2
    Locate the following in your stylesheet (from the drop down list on the design tab):

    Code:
    a.link_menu:visited  {
    	padding: 2px 5px 2px 5px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />; 
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:link  {
    	padding: 2px 5px 2px 5px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:active  {
    	padding: 2px 5px 2px 5px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:hover  {
    	padding: 2px 5px 2px 5px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette1" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    and replace it all with:

    Code:
    a.link_menu:visited  {
    	padding: 2px 12px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />; 
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:link  {
    	padding: 2px 12px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:active  {
    	padding: 2px 12px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette2" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    	
    a.link_menu:hover  {
    	padding: 2px 12px;
    	margin: 0px 1px 0px 0px;	
    	color : <actinic:variable name="PaletteBG" />;
    	text-decoration : none;
    	background-color: <actinic:variable name="Palette1" />;
    	border: 1px solid <actinic:variable name="Palette3" />;
    	}
    Where you see 4 instances of padding being specified, currently as (padding: 2px 12px, if you are not happy with the new size then adjust the 12px either up or down accordingly. You currently have 5px, i've changed it to 12px for you, so use that scale visually to decide what you actually want. Change it to be the same in all 4 places!

    Comment


      #3
      Brilliant

      Here's a big hand to Lee for sorting this out for me....simply saved me a great deal of time....

      Kind Regards,

      Piersland

      Comment

      Working...
      X