Common CSS Questions

[Danny+ 1,327]

Here is a list of Common CSS tweaks that can be given to customers, please feel free to add to the list

[Danny+ 1,327]

This topic will be a complete list of the most commonly asked CSS customisation questions on the support forums. Below you will find a title of a commonly asked question and underneath will be the answer, simply add the code into the custom code area in your themes settings. Please remember to change the color hex codes to your preferred color choice. How to remove the Pagelines Leaf Logo from the footer. [code]#cred { display: none; }[/code] How do I change the primary nav background color. Full Width of site. Example Image: http://i.imgur.com/Iw1oU.jpg [code] /* CSS FOR NAV BACKGROUND COLOR */ #primary-nav { background-color: #FF0000; } /* THIS HIDES THE BORDER AT THE BOTTOM */ #nav_row.main_nav, ul.sf-menu ul li { border-bottom: 0 none; } /* THIS MAKES THE li BACKGROUNDS TRANSPARENT */ .sf-menu li, .main_nav ul.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background-color: transparent; } [/code] Width of Layout. Example Image: http://i.imgur.com/AoBmx.jpg [code] /* CSS FOR NAV BACKGROUND COLOR */ #primary-nav .content { background-color: #FF0000; } /* THIS HIDES THE BORDER AT THE BOTTOM */ #nav_row.main_nav, ul.sf-menu ul li { border-bottom: 0 none; } /* THIS MAKES THE li BACKGROUNDS TRANSPARENT */ .sf-menu li, .main_nav ul.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background-color: transparent; } [/code] How to change the primary nav text color. [code] /* THIS WILL CHANGE THE FONT COLOR IN THE NAV */ .main_nav li a { color: #000000 !important; } [/code] How to change the hover background/text color of menu item. Example Image: http://i.imgur.com/H6ql4.jpg [code] /* CSS FOR WHEN HOVERING OVER A MENU ITEM */ .main_nav .main-nav li a:hover, #grandchildnav .current_page_item a, #grandchildnav li a:hover, #grandchildnav .current_page_item ul li a:hover, .sf-menu li:hover, .sf-menu li.sfHover { background-color: #FF0000; color: #FFFFFF; } [/code] How to change the current menu item background/text color. [code] /* CSS FOR CURRENT PAGE MENU ITEM */ .main-nav li.current-page-ancestor a, .main-nav li.current_page_item a, .main-nav li.current-page-ancestor ul a, .main-nav li.current_page_item ul a.sf-menu li li { background-color: #FF0000; color: #FFFFFF; } [/code] How to change the active menu item background/text color: [code] /* CSS FOR ACTIVE MENU ITEM, USEFUL FOR DROP DOWN MENUS */ .main-nav li.current-page-ancestor a:active, .main-nav li.current_page_item a:active, .main-nav li.current-page-ancestor ul a:active, .main-nav li.current_page_item ul a:active { background-color: #FF0000; color: #FFFFFF; } [/code] More to come... If you have any suggestions, please PM and do not reply. Also hit the "Thanks" button if this helped you!