Oxygen Widgets Margins/Padding

• 

  richwoodward · Member · Apr 22, 2013 at 11:05 am

  • Copy link
  • Add topic to favorites

  The blog I need help with is http://carvingnature.net/

  1. I’m trying to alter the CSS to b) make the space between widgets smaller and b) make the space between the secondary menu and the widget beneath it smaller. How can I do this?

  2. How can I alter the color of the active menu item in the primary/secondary menus (i.e. the color of the item corresponding to the page being viewed)?

  Thanks in advance,

  The blog I need help with is: (visible only to logged in users)

• 

  justpi · Member · Apr 22, 2013 at 11:45 am

  • Copy link

  1. Add this in the CSS editor:

  .widget {
      margin-bottom: 30px;
  }
  .menu-secondary {
      margin-bottom: 30px;
  }

  Decrease the values to adjust.

  2. Add this:

  .main-navigation li.current_page_item a, .main-navigation li.current-menu-item a, .menu-secondary li.current-menu-item a, .menu-secondary li.current-page-item a {
      color: #456789;
  }

  456789 is just an example, of course. For palettes and color codes see here:
  http://www.december.com/html/spec/color.html

• 

  richwoodward · Member · Apr 22, 2013 at 1:58 pm

  • Copy link

  Many thanks.

  One little last thing. I’ve added an email icon to the Contact page on my blog (see carvingnature.net/contat) and I’ve added tags so that clicking the icon sends an email to our address. But because the icon is classified as a link, when the cursor hovers over it, the image gets an ugly underline.

  I thought that adding style=”text-decoration: none” to the href instruction would remove this, but it doesn’t. I don’t want to change the text decoration for all the links, just this one. How can I do this?

  style=”text-decoration: none”

• 

  justpi · Member · Apr 22, 2013 at 3:24 pm

  • Copy link

  First, adding text-decoration:none would remove an underline if the underline was present when you view the page: the line you don’t like shows only when you hover over the image link. Second, it’s not an underline anyway, it’s a bottom border.
  To get rid of it, add this in the CSS editor:

  #post-34 a:hover {
      border: none;
  }