WordPress.org

Ready to get started?Download WordPress

Forums

Montezuma
Widget title and post/page title same height? (9 posts)

  1. Zaralene
    Member
    Posted 5 months ago #

    Hello, I have a question about how to adjust the height of my page/post title and the title of my first widget.
    Here's my site:http://creacont.nl/
    As you can see the title: 'Laat uw producten beleven' (which is in the content) and the title of the widget 'Blog' are not on the same height. Where can I change that?
    Thanks upfront for helping out.

  2. ellp
    Member
    Posted 5 months ago #

    Hello Zaralene!

    You will need to change your style.css file. Find the follow lines:

    .hentry > h1{
    color: 				#13a89e;
    font-size: 			50px;
    line-height: 			45px;
    margin: 				0 0 20px 0;
    }

    Here you need to change the line "font-size" and insert a value that you whant.

    Then you need to change the line:

    .widget > h3{
    color: 			#13a89e;
    margin: 			0 0 15px 0;
    font-size:			32px;
    line-height: 		29px;
    }

    And change the font size to the same size as the previous code. And done :)

    Let me know if it helps you.

    Evandro

  3. CrouchingBruin
    Member
    Posted 5 months ago #

    @Evandro, the Montezuma theme is different from most themes in that the style.css file is dynamically created from virtual CSS files. Developers therefore do not need to create a child theme (which is what would normally be recommended instead of changing the style.css file directly), but still have the advantage of not having their modifications lost if the theme gets upgraded.

    @Zaralene, Evandro pointed out the correct rules that need to be change. There are two approaches that you can use:

    1. You can go to the rules in the virtual CSS files and change them (the first rule is located in the posts.css virtual file and the second rule is in the widgets.css virtual file).
    2. You can add a rule to the end of the various.css virtual file (or to your custom CSS plugin file) which overrides the font-size property for both rules at once:
      .hentry > h1,
      .widget > h3 {
         font-size: 50px;
      }

      The advantage of doing this are that you don't have to hunt down the two rules and change them, plus you'll insure that both elements will have the same font-size since you only need to set the property once.

  4. Zaralene
    Member
    Posted 5 months ago #

    I changed the size of the font to 40 and put the line height on 32 also, but it didn't make a difference, it is still not on the same height. I tried both options. There is also a huge gap now between the breadcrumbs and the page title which probably has to do with the social media icons.

  5. CrouchingBruin
    Member
    Posted 5 months ago #

    The text on your page title (Laat uw producten beleven) and widget titles (Blog, Nieuwsbrief, etc) look the same size, to me.

  6. Zaralene
    Member
    Posted 5 months ago #

    I didn't mean the same size, but on the same height/level :) So see as from the header the Page title is on a different height than the blog. I hope you understand what I mean, I will make a picture otherwise of what I mean.

  7. CrouchingBruin
    Member
    Posted 5 months ago #

    Ah, OK, now I understand.

    The post entries have a top padding of 30px, so you can add this CSS rule to add padding to the widget area:

    #widgetarea-one {
       padding-top: 30px;
    }
  8. Zaralene
    Member
    Posted 5 months ago #

    Yes, that's what I meant. Thank you very very much. :)

  9. ellp
    Member
    Posted 5 months ago #

    CrouchingBruin,

    Thanks for the input :)
    I didn't how this theme works.

    Zaralene, I'm glad this work for you :)

Reply

You must log in to post.

About this Theme

About this Topic