Page alignment and spacing

Hello,

First of all, thank you for the wonderful theme. My knowledge of PHP and CSS are limited and I keep searching through the code and changing numbers to see what it affects but right now I’m out of time and I need your help.

I have removed the page title by putting in this code in custom CSS section

.page .entry-title {
    display: none;
}

What I want to achieve now is to:
1- Align the blue box to the left so the yellow line doesnt appear. This screenshot was taken with No Sidebar layout. I will use the sidebar in other pages but not in this one. And I don’t want the content to be full width.
2-decrease the red line to 11px
3-align the images to the left so the green line disappears.

Thank you so much for your help

Hi @utkusarioglu,

I hope you are well today and thank you for your question.

Could you please share me the page URL from your site where it’s displaying so that i can help you to achieve it?

Kind Regards,
Movin

Sure! Sorry I didn’t think the url would have been relevant. That’s why I didn’t include it in the first message. I’ll paste the page that the screenshot is taken from.

http://www.utkusarioglu.com/social-media/

Other pages will use the same layout, except for the blogs. I will place a sidebar on the right side in those.

Thank you for sharing the page URL.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

body.page section.content-area {
    padding-top: 85px;
}
body.page #primary {
    float: left;
}
body.page #primary figure.thumbnail {
    margin-left: 0;
}

Hi Movin, thank you for your answer and effort. Everything works perfectly:) I had to change the padding amount because it created a huge white space right under the header, but i made the code work

Thank you again!

I’m sorry for posting twice on this but I have been toying around a bit and i made the code work by using:

body.page section.content-area {
    padding-top: 0px;
}

If i do that then i dont have the white band on the frontpage as i mentioned in the previous message. But now i have to add small white images to the beginning every page so the content keeps some distance from the gray title section.

Is there a way to exclude the front page from this padding code?

You are most welcome here :slight_smile:

To help us keep support thread separates could you please create new thread for your new question here https://colorlibsupport.com/c/shapely/ instead of replying on your existing thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.