How do I disable the sidebar and close a gap of space in the "Renew" stack?

Support
#1

Please see the image; 1 indicates a big empty white space because I just set the sidebar to “0 px” but that didn’t do enough. I’d like to disable the sidebar so that my content is on the center of the page instead of leaving a big empty white space on the right.

I’d also like to close the gap at the top of the page (see “2”). How can I do this?

Thanks! site: savaroneamman.com

#2

Hi @stevenkwlee,

Thanks for writing in.

Add this in your custom CSS:

.el6.x-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%; 
}
.home .x-header-landmark{
    display:none;
 }

Let us know how it goes.

Thanks.

#3

Hello! Thanks for your response.

I am still seeing the big gap on the right side:

#4

I also really like the code for getting rid of the gap at #2 on the first image; is there a CSS line that would do this for all pages? Thanks! :slight_smile:

#5

Hi There,

To remove the sidebar you can visit your page on Cornerstone > Settings > Page templates > Select: Blank No Container Header Footer.

Hope it helps

#6

Hey, can you send screenshots? I’m not finding the “Settings” button on Cornerstone on my page.

#7

I actually just found it, but it did not help. There is still this large white gap here.

I’m trying to center all my page’s content into the middle of the page.

#8

Hi,

Try to use just one column, then add your image together with your text.

eg.

<img style="float:right;" alt="Image" src="http://savaroneammann.com/wp-content/uploads/2018/02/Resized-Sav.jpg" width="708" height="1064">
<h2 style="text-align: left"><strong>Snapshot of Sav</strong></h2><p style="text-align: left"><span><br>At my core, I am a creative. </span></p><p style="text-align: left"><span>I seek out stories and identify the best medium to tell them. Visual stories have always been the most attractive to me. Yet, a story is still only an idea floating through someone's head. This is where producers come in. We grab an idea we believe in and run as fast as we can with it. We generate buzz, acquire funds, hire the talent, and breathe life into the story. </span></p><p>My name is Savarone and I am driven by stories. Welcome to my website.</p>

Hope that helps.

#9

Thanks! That did the trick. My last question is: is there a way I can control the corners of this image?

Like the corners of Sav’s picture is rounded in the above photo:

#10

Hi there,

Please update the image code to:

<img class="x-img-rounded" style="float:right;" alt="Image" src="http://savaroneammann.com/wp-content/uploads/2018/02/Resized-Sav.jpg" width="708" height="1064">

To add rounded borders to the edges of the image.

Hope this helps.

#11

Hi there, thanks for the code!

Is there a way to control how rounded I want the image? i’d like it to be more rounded than this.

#12

For example, I’d like the curve on my homepage to look like the curves here:

Please advise, thank you :slight_smile:

#13

Hi There,

So you want to control the border-radius, please update your image code to this:

<img class="x-img my-img-radius" style="float:right" alt="Image" src="http://savaroneammann.com/wp-content/uploads/2018/02/Resized-Sav.jpg" width="300" height="1064">

Then use this custom CSS to control the border-radius of that image.

img.my-img-radius {
    border-radius: 50px !important;
}

The larger the value the more curve corner it has.

You can actually use this to your other images, just add a CLASS my-img-radius to your image.

Thanks,

#14

Thank you so much!!

#15

You’re more than welcome, glad we could help.

Cheers!

#16

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