Reduce Title Container Size

On my website, I have the page and post titles removed as I have a branded image as the title.
I have used the following CSS to hide the title:

/* Page Titles */
h1.entry-title {
display: none;
}

How could I possibly hide, remove or minimize the size of the container ( Area Between Red Arrows ) so that my ‘Title Image’ shows higher up the page?

Any help would be greatly appreciated.

Thanks,

Richard

Hello Richard,

Thanks for writing in!

Please add following CSS under X > Theme Options > CSS:

.single-post .entry-featured {
    display: none;
}

.single-post .x-container>.offset {
    margin-top: 0;
}

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

Awesome! Thanks Prasant. The videos look helpful too. I will take a look at those tonight!

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.