Plugin is not responsive

  • Resolved koupmi

    (@koupmi)


    5 years, 10 months ago

    Hello,
    How to edit this css class?

    @media only screen and (max-width: 700px)
    .giftwrap_header_wrapper {
    position: relative !important;
    left: 21% !important;
    }

    Instead left: 21% !important; i need text-align: center; and margin gift button to center.

    This “left: 21% !important;” broke full page, because on phone is page 21% moved to left. Why is this styled like that in plugin?

    Similar problem is with couple more classes. Can you help me with this problem? Thank you.

    • This topic was modified 5 years, 10 months ago by koupmi.
    • This topic was modified 5 years, 10 months ago by koupmi.
Viewing 8 replies - 1 through 8 (of 8 total)
  • Little Package

    (@littlepackage)

    5 years, 10 months ago

    Hi @koupmi

    Thanks again for getting in touch. As I mentioned by email, that CSS is NOT included with the plugin, and so the plugin is innocent of what you’re accusing. There’s nothing I can do about code I didn’t write.

    Could it be your THEME adding this CSS?

    Anyway, try this CSS instead, it should take precedence:

    @media only screen and (max-width: 700px) {
    body .giftwrap_header_wrapper {
        left: 0 !important;
    }
}
    Thread Starter koupmi

    (@koupmi)

    5 years, 10 months ago

    My apologize, seems this css is generated by WP Bakery (terrible plugin, sadly customer want it). So is there some way, how disable WP Bakery from checkout page?

    This code is from index.php:

    <style type="text/css" data-type="vc_custom-css">@media only screen and (max-width:700px){
    
.giftwrap_header_wrapper {
    
position:relative !important;
left:21% !important;
}    
label.giftwrap_desc {
font-size: 25px !important;
text-align: left;

position: relative;
left:10% !important;
max-width: 100% !important;
}    
p.giftwrap_details{
margin-top: 15% !important;    
}
.giftwrap_thumb {position:relative; left: 25% !important;}
.modal-footer {text-align:center;}

}

.giftwrap_header_wrapper {
    margin-top: 20px !important;
    left: 42%;
    position: relative;
    
}
.wc_giftwrap_notes_container {display: none !important;}
li.giftwrap_li, .giftwrap_ul li {float: none !important;}
.giftwrap_thumb {position:relative; left: 3%;}
label.giftwrap_desc {
    font-size: 30px;
    font-weight: 200;
    font-family: Montserrat, 'BlinkMacSystemFont', -apple-system, 'Roboto', 'Lucida Sans';
    position: absolute;
    top:10px;
    left: 20%;
    text-transform: inherit;
}
p.giftwrap_details {
    margin-top: 45px;
    text-align:center;
}</style>
    • This reply was modified 5 years, 10 months ago by koupmi.
    Little Package

    (@littlepackage)

    5 years, 10 months ago

    Sorry, I do not support WP Bakery. You’d need to ask them.

    Just like in my last example, you can override all the !important tags by adding your own CSS with a higher specificity.

    humboldt123

    (@humboldt123)

    5 years, 10 months ago

    Hi,

    • This reply was modified 5 years, 10 months ago by humboldt123.
    Little Package

    (@littlepackage)

    5 years, 10 months ago

    Hi @koupmi,

    This plugin is responsive, so I hope you have gotten this sorted out. Please let me know if you are still needing help. Thank you.

    Little Package

    (@littlepackage)

    5 years, 9 months ago

    Hi again @koupmi

    I never heard back so I’ll assume you’re sorted out for now. If you still have questions please feel free to open a new topic. This topic is now closed. Thank you!

    Thread Starter koupmi

    (@koupmi)

    5 years, 9 months ago

    Hello, i rewrote WPBakery css with !important tags and customized design. The problem is solved, thank you for help!

    Little Package

    (@littlepackage)

    5 years, 9 months ago

    @koupmi AWESOME!

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Plugin is not responsive’ is closed to new replies.