[Resolved] Postion content within elements

Home Forums Support Postion content within elements

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1176751
    Aldrin

    Hi there, I’m having a challenging time positioning the <h1>{{post_title}}</h1> within the element to show in a position other than center, left or right. I’ve even tried giving the .inside-page-hero a position: relative and incased <h1>{{post_title}}</h1> within a div with position: absolute; top:100px; left: 50px;

    The issue is the background image for the element becomes smaller, hiding parts of the image. I hope I’m being clear enough. I have a sample image here where I’d like the content in the element to display.

    https://whatsupweekly.com/sample.jpg

    #1176803
    Aldrin

    I think the best way is to do it is by controlling the padding within the elements. Setting the top padding higher than the lower resulted in the content being pushed down. Same thing goes with the left and right padding. Is this pretty much the correct way of trying to acheive what I’m trying to do?

    #1176838
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    That sounds like a good solution.

    You can also give the <h1> a class, then add margin to it to move it around:

    <h1 class="my-h1-class">{{post_title}}</h1>

    .my-h1-class {
        margin-top: 100px;
    }
    #1176842
    Aldrin

    Thanks Tom..it works well.

    #1176846
    Tom
    Lead Developer
    Lead Developer
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.