Navigation
Archive / Decrease height of section
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • August 15, 2016 at 12:41 pm #1132242
    bekahwordsmith
    Participant

    Hi!

    I’d like to decrease the height of two sections on the homepage on my website. You’ll also see the images I use don’t quite extend to the full height of those sections (the two pink sections).

    How can I go about fixing this?

    I’m including login information below since the website is under construction.

    Thanks!

    August 15, 2016 at 12:43 pm #1132243
    bekahwordsmith
    Participant
    This reply has been marked as private.
    August 15, 2016 at 1:20 pm #1132300
    Rahul
    Moderator

    Hey There,

    Thanks for writing in!

    Regretfully, at this time I am not entirely certain what it is you’re trying to do.
    If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do. We’ll be happy to provide you with a response once we have a better understanding of the situation.

    Additionally, you can decrease the height of the section by decreasing the font size within the sections.

    August 15, 2016 at 1:39 pm #1132317
    bekahwordsmith
    Participant

    Hmmm…not sure how else to explain that…

    If you look at the two sections on the homepage that have a pink background, you’ll see an image in each one that doesn’t quite fill the entire section. It falls short in height. I’d like the images to fill the entire column. So, in that case, I need a way to increase the height of the image so it fills the column.

    If possible, I’d also like to decrease the overall height of the section…even just by 20%. If decreasing the font size is the way to make the section shorter in height, how do I do that?

    August 15, 2016 at 4:47 pm #1132543
    Nico
    Moderator

    Hi There,

    Try adding mbn in your class box in the image. Check attached to what I mean.

    Hope it helps.

    Let us know how it goes.

    Thanks.

    August 16, 2016 at 9:19 am #1133576
    bekahwordsmith
    Participant

    Hi! So, that worked perfectly for the first section (with the headshot), but it didn’t work for the second section (with the picture of the event space).

    Thanks!

    R

    August 16, 2016 at 12:31 pm #1133891
    Christian
    Moderator

    Hey R,

    The issue was caused by and empty <p></p> which is generated by WordPress at the end of your [container] shortcode in the Text element at the left side of your image. I added margin-bottom: -1.313em to the shortcode to fix (see attachments).

    Hope that helps. 🙂

    September 4, 2016 at 4:38 pm #1160853
    bekahwordsmith
    Participant

    Hi!

    Okay..let’s face it. I’m new to this. 🙁

    And I’m still having issues with these pink boxes and could use some help.

    The pink boxes are not behaving how I’d like. I want them to be responsive, but the elements go outside the section when I resize the browser.

    If you go to this website http://cocktailsdetails.com/ and view their pink boxes, they are responsive and resize nicely. You can resize the browser and everything behaves correctly and looks clean.

    With mine, the elements get weird and the border around the text doesn’t look right.

    Help?

    September 4, 2016 at 9:52 pm #1161068
    Rue Nel
    Moderator
    This reply has been marked as private.
    September 5, 2016 at 1:12 pm #1161958
    bekahwordsmith
    Participant

    You are an angel sent down from heaven! Those boxes have been driving me insane. THANK YOU, THANK YOU, THANK YOU!

    I see exactly what you did and was able to replicate it. 🙂

    -R

    September 5, 2016 at 1:18 pm #1161964
    Prasant Rai
    Moderator

    You are most welcome. Feel free to get in touch with us regarding any further queries about the X Theme and Cornerstone. 🙂

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1132242 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>