Weird issue with the font-size

• 

  pixelcounter · Member · Dec 12, 2011 at 4:27 pm

  • Copy link
  • Add topic to favorites

  Hi, does anyone know why does the font change in size when viewing the post in a single mode? It seems to grow at least one point and thus breaks the consistency of the layout.

  Here’s an example: http://pixelcounterrr.com/2011/11/27/perfect-licene/ and then compare the font to the homepage font http://pixelcounterrr.com

  Really bizarre problem to which I haven’t found yet an solution.

  Thanks!

  -Topi

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

• 

  thesacredpath · Member · Dec 12, 2011 at 6:03 pm

  • Copy link

  Single post content “p” font size set here.

  .widecolumn .entry p {
  font-size: 1.05em;
  }

  Main page content “p” font size set here.

  #content {
  font-size: 1.2em;
  }

• 

  pixelcounter · Member · Dec 12, 2011 at 6:11 pm

  • Copy link

  Thanks for the reply,

  I tried to change the values to match each other but it seemed to have no effect whatsoever.

  Perhaps the built-in font-editor is overriding the css or something?

• 

  thesacredpath · Member · Dec 12, 2011 at 6:42 pm

  • Copy link

  Add the “!important” attribute to each and see if that fixes it.

  .widecolumn .entry p {
  font-size: 1.05em !important;
  }
  
  #content {
  font-size: 1.2em !important;
  }

• 

  pixelcounter · Member · Dec 12, 2011 at 6:53 pm

  • Copy link

  Yes sir, that did the trick!

  I have, though, no idea how those different measures (1.05em / 1.2em) can result in equal font sizes, but I can live with that :)

  Thanks again,

  Topi

• 

  thesacredpath · Member · Dec 12, 2011 at 6:58 pm

  • Copy link

  em units are in relationship to a size declaration in a parent element (sort of like using a percentage). Two different parent elements, two different font sizes declared in those parent elements, thus two different results.