Customized Twenty Eleven help

• 

  factsaboutsnails · Member · Jun 16, 2012 at 1:34 am

  • Copy link
  • Add topic to favorites

  This is my very first time using WordPress, so please be gentle. I’ve used Dreamweaver before, so I have some idea about CSS.

  I have Customized Twenty Eleven. I’ve done some simple changes, but NONE of them are working… and it’s REALLY frustrating. I’m sure I’m doing something wrong (which is simple).

  Below is exactly what I’ve typed in the CSS Stylesheet Editor:

  h2 {
  font:24px;
  }

  .widgettitle {
  text-transform:none;
  line-height:2em;
  }

  h3 {
  font:15px “Helvetica Neue”, Helvetica, Arial, sans-serif;
  }

  #access ul ul a {
  line-height:1.2em;
  padding:5px;
  }

• 

  designsimply · Member · Jun 16, 2012 at 4:35 am

  • Copy link

  In Twenty Eleven, the post titles use the h1 tag, not h2, and the widget titles use h3. However, using classes will be the better option in this case because it matches more closely with the original theme stylesheet. Also, when you set fonts on the Appearance → Custom Design → Fonts page, font size gets a very specific rule which you can only override by making your rule more specific. You can get around it by using the “!important” tag, but it should be avoided unless it’s really needed like it is in this case. Here is how to change the post titles to 24px:

  .entry-title {
  	font-size: 24px !important;
  }

• 

  designsimply · Member · Jun 16, 2012 at 4:37 am

  • Copy link

  For widget titles, the class name in Twenty Eleven is “widget-title” not “widgettitle” (you are missing a dash), so you would want to use a rule like this instead:

  .widget-title {
  	text-transform:none;
  	line-height:1.5em;
  }

• 

  designsimply · Member · Jun 16, 2012 at 4:39 am

  • Copy link

  The h3 value should target widget titles, however, you’re running into trouble with rules from the Appearance → Custom Design → Fonts page being more specific rules again You can override them like this:

  .widget-title {
  	font:15px "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  }

• 

  designsimply · Member · Jun 16, 2012 at 4:41 am

  • Copy link

  This one should work as is, it targets submenus specifically:

  #access ul ul a {
  line-height:1.2em;
  padding:5px;
  }