Remove the white box

Hi,
How can I remove the white box from my page that was created by visual editor? thanks.
http://sample01.rswedding.com.au/

What I mean is, I want the background image to be shown without the white box, and my text still be visible, thanks.

Hi,

Please try to use these css code:

pre {
    background-color: unset;
    border: none;
}

you can use simple custom css code to put the code in above

Hi, it works. Thank you very much.

Just one more question, how can I make it responsive? thanks

Would like to show the whole background picture even it’s in mobile size. thanks.

Hi,

The image is already responsive when displaying on mobile device.
As default, the image can’t display in full width because the resolution between mobile screen and desktop screen is different but it displaying the best size of the image.

If you want the image to display in full width, you have to reduce the height, means your image will display smaller.

Let me know if its okay to display the image more smaller, so I can provide you the custom css code.

Hi, Yes I would like the image to display smaller when it’s a mobile device, thanks.

After inspecting the HTML element of your site, here is the css code to made the image displayed in full width:

@media only screen and (max-width: 1024px){
  #pg-11-0 .panel-row-style {
    background-size: contain;
    padding: 66px 0 !important;
  }
  #pg-11-0 .panel-row-style .textwidget span {
    padding-top: 0 !important;
 }
}

One question, why don’t you put the image as header image? I see your image is set to background of the text widget.

Hi,

To answer your question, I tried to put the image as header image, however I cannot put any titles on there (like the image slider), is there a way to do it tho?

Thanks for the css code, it works. I can see that the image will change to a smaller size once the screen is smaller, can I do that for the text as well?

The header image slider will adjust it’s image and text size depend on the screen size smoothly, is it possible to achieve that with the background image?

Thanks.

I see, so you only want the header only display one image and no slide effect.
There is option to make it possible.
To disable the slide effect please go to customize > header area > header slider > Slider speed > and put 0 as value.

Hi, Yes that’s what I want, sorry for the trouble.
Just one more thing, is it possible to remove the (click to begin)button in the middle?
Thanks.

Still on
customize > header area > header slider
Please scroll to the bottom and you can see all setting of the header slider

Hi, Ok thanks.
Really like the support here. A+
Thank you very much.

Thank you for the grade :smiley:
Feel free if you need more help :slight_smile: