Home>Support>Image Bleed out – PageBuilder and might be Visual Editor

Image Bleed out – PageBuilder and might be Visual Editor

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

hello,
on my homepage i want to achieve a style similar to the image i attach here ( i added some watermarks, cause those ICONS i purchase and dont want someone use them):

http://s17.postimg.org/qjni5lc5b/All_Badges.jpg

im using Vantage theme, with pagebuilder for my red and beige background i put each one in a different layer.
i want the my transparent image of the badges will bleed out from the red BG to the beige BG is it possible? of course doing it to affect only at this particular place (not effect the entire website) .

as well, i can i remove the image FRAME, the thin outline of images, again only for this image.
thanks so much!!
Eran

URL: http://www.972kravmaga.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 7 months ago Andrew Misplon
    Hi, I Work Here

    Hi do0rway

    To create the effect you want you’ll need to create a background image, it must be as high as you require but can be 1px wide. Add it to the Media Library, copy the url from the right column metabox and add it via the Row Style button background image field. That’s the second button on the right of that Page Builder row. Then insert the below under Appearance > Custom CSS to ensure the image repeats:

    /* Home */
    
    .home .panel-row-style {
    background-repeat: repeat-x !important;
    }
    

    To remove the image outline and shadow head to Appearance > Customize > Page and un-check the Image Shadow and Border checkbox there. That’ll be sitewide. To remove the border only for this page you’d need to insert the following under Appearance > Custom CSS:

    /* Vantage Remove Image Shadow and Rounding */
    
    .home .entry-content img { -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important }
    
  2. 10 years, 7 months ago do0rway

    works like charm!!!
    i just added the next code to your first one you provide, to position the BG to TOP:

    background-position: top; 

    thank u so much for your help!

  3. 10 years, 7 months ago Andrew Misplon
    Hi, I Work Here

    Super, glad to hear you made progress there.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More