Editing Twenty Ten menu look

• 

  cmax1088 · Member · Oct 11, 2012 at 8:34 pm

  • Copy link
  • Add topic to favorites

  I have been searching for how to change the style/look of the menu in Twenty Ten and can not find anything beyond font and color. I’m interested in things like shading and borders to give the menu a sense of depth/texture/something.

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

• 

  designsimply · Member · Oct 13, 2012 at 5:59 pm

  • Copy link

  Here’s an example for how to add a bottom border and a bottom shadow to the menu in the Twenty Ten theme:

  #access {
  	border-bottom: 2px solid blue;
  	-webkit-box-shadow: 0px 4px 5px rgba(25, 25, 25, 0.25);
  	-moz-box-shadow:    0px 4px 5px rgba(25, 25, 25, 0.25);
  	box-shadow:         0px 4px 5px rgba(25, 25, 25, 0.25);
  }

  Not that box-shadow is a CSS3 property and so it won’t work on older browsers.

  I used this handy little site to figure out what box-shadow properties to add:
  http://css3gen.com/box-shadow/

• 

  designsimply · Member · Oct 13, 2012 at 6:00 pm

  • Copy link

  To learn more about CSS, you should check out this beginner tutorial:
  http://www.htmldog.com/guides/cssbeginner/

  There’s lots of neat stuff you can do with CSS!

• 

  cmax1088 · Member · Oct 13, 2012 at 8:53 pm

  • Copy link

  Thanks for the reply! Been checking out sites but learning slowly. Going to use these for sure.