B) The header has jumped from 60px to 165px deep.

Homepage › Community Forums › Epik Theme Support › B) The header has jumped from 60px to 165px deep.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 9, 2013 at 10:04 pm #6347
    Terence
    Customer

      At http://qloudpress.com

      I’ve alter the CSS around line #1954 as follows:

      .header-image .site-title a {
	float: left;
	min-height: 60px;
	width: 285px;
}

      And I have altered the functions.php to match:

      // Add support for custom header
add_theme_support( 'genesis-custom-header', array(
	'width' => 285,
	'height' => 60
) );

      but the header is still 165px high for some reason.

      Any ideas?

      August 9, 2013 at 10:16 pm #6349
      Eric
      Customer

        Its actually the header widget area. When you add a logo, it activates this css code – 

        .header-image .site-header .widget-area {
	padding: 40px 0;
	padding: 2.5rem 0;
}

        Notice – header-image .site-header .widget-area is the entire widget area all together. By default it adds 40px padding to the top and bottom. You can decrease this to a size that works for your site.

        I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

        August 10, 2013 at 4:40 am #6362
        Terence
        Customer

          OK, thanks Eric, that defines the problem but not the solution.

          So Google is my friend, and I have just learned that REM is the fallback with Sass or LESS, is relative to the font-size of the parent element on which it is defined and that this means, if one of the parents in the DOM-tree changes its font-size, the font-size of the child element changes too. Also that in contrast the REM unit is relative to the root element of the page (this means the html element), and thus it is possible to define a font-size once on the root and make all other sizes depending on this size.

          So then I realized, I have to learn how to convert one into the other in order to deal with this situation, so I found the converter here ~ http://foliovision.com/2013/03/responsive-design-calculator ~ and worked out/confirmed that 40px is actually 2.85714286rem, and then I really started to get confused.

          But in the end, I went with the following, and it seems to work quite nicely…

          .header-image .site-header .widget-area {
	padding: 10px 0;
	padding: 0.72rem 0;
}

          Thanks Eric, my education continues… 8^)

          August 10, 2013 at 11:06 am #6371
          Eric
          Customer

            You’re Welcome

            I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

          • Author
            Posts
          Viewing 4 posts - 1 through 4 (of 4 total)
          • The topic ‘B) The header has jumped from 60px to 165px deep.’ is closed to new replies.