WordPress.org

Ready to get started?Download WordPress

Forums

Spun
Hentry alignement (8 posts)

  1. iffikas
    Member
    Posted 1 year ago #

    Hi.

    My webpage only needs 3 hentry elements. But somehow it is impossible to align them to the middle of page.

    If I use center, then hentry elements go above eash other.

    Maybe this is a stupid question, but I am quite new to css and wp.

    Thank you in advance,

    I

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Can you provide a link to the webpage with the issue?

  3. Caroline Moore
    Member
    Theme Author

    Posted 1 year ago #

    You need to adjust the width of the .hentry elements' container and set its margins to auto. Something like this should work:

    #main {
       margin: 0 auto;
       width: 600px;
    }

    Note this will adjust the page width on subsequent pages/posts, too, and I don't know how it will affect the responsive versions of the theme. You may need to play around with it to get the results you desire.

    I recommend doing this in a child theme or a CSS plugin (like Jetpack). You can find helpful resources for CSS here, and I recommend using Firebug for this type of work.

    Good luck!

  4. iffikas
    Member
    Posted 1 year ago #

    Okay now I managed to center them, but they still appear under each other

    *page 1
    *page 2
    *page 3

    But I want them to be like

    *page 1 *page 2 *page 3

    Changing the hentry element height doesn't help. I am already using child theme and Firebug, but I still doesn't manage to find correct code for css to align them as wanted.

    Currently I hentry code looks like this:

    .hentry {
    	background: transparent;
    	margin: 10px auto;
    	width: 800px;
    	height: 180px;
    	float: center;
    	position: relative;
    	table-layout:fixed;
    }

    I have played with settings but nothing seems to help me. I am pretty sure it's about my lack of knowladge.

  5. Caroline Moore
    Member
    Theme Author

    Posted 1 year ago #

    float: center is not a valid CSS property. Can you post a URL so we can see what you're trying to do?

  6. iffikas
    Member
    Posted 1 year ago #

    Hi again.

    The webpage is located at http://www.snakehouse.ee

  7. Caroline Moore
    Member
    Theme Author

    Posted 1 year ago #

    You need to float the .hentry elements to the left and remove margin: auto on those.

    Then do as I said above and set a narrower fixed width on the containing div, in this case #main, setting its margins to auto to center it.

  8. iffikas
    Member
    Posted 1 year ago #

    Thank You, very much. That fixed it.
    Although it affects all other pages too, but it's okay.

    Thanks!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.