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,
I try to customize the div on smartphone:
media (max-width: 780px)
# pgc-1497-0-0, # pgc-1497-0-1, # pgc-1497-0-2, # pgc-1497-1-0, # pgc-1497-1-1, # pgc-1497- 1-2 {
margin-bottom: 30px;
}But I do not know how to remove the margin by default on smartphone how I should do?
Thank you
My website : http://savoyroche.com/property/thoiry-ferme-2/
Justine
Hi Alpine Lodges
The correct formatting of the CSS rule you pasted would be:
@media (max-width: 780px) { #pgc-1497-0-0, #pgc-1497-0-1, #pgc-1497-0-2, #pgc-1497-1-0, #pgc-1497-1-1, #pgc-1497- 1-2 { margin-bottom: 30px; } }Give that a try.
Hello,
This code does not seem to fit, I think that the code is :
media (max-width: 780px) { # pgc-1401-0-0, # pgc-1401-0-1, # pgc-1401-0-2, # pgc-1401-0-3, # pgc-1401-1-0, # pgc-1401- 1-1, # {pgc-1401-1-2 margin-bottom: 0px; } }No ?
I added this code in the editor page builder “edit row”> “css rules”, but it does not work, see the screen shot: http://savoyroche.com/screenshot.png
Thank you for your help
Hi :)
media rules need to start with an @.
http://www.w3schools.com/cssref/css3_pr_mediaquery.asp
However, the method you’re trying to change this bottom margin (using Row Attributes), unfortunately, isn’t suitable and won’t work.
Have you tried editing each row by clicking the wrench icon and then Edit RowTheme and enabling No Bottom Margin?
Thanks for your patience, we’ll definitely be able to resolve.
Hello,
I just forget the @ when I published the post…
I do not know if I understood, I indicated in the corresponding field : 0px to “bottom margin” in edit row> layout> bottom margin is this?
Because it does not change on smartphone, that’s the same thing
Thank you for your help
The No Bottom Margin setting will apply the same row bottom margin 0 value for both desktop and mobile.
If you send the URL you’re working on and let us know the mobile result you’ll trying to achieve, we can try help.
Thank you, I send you the url :
http://savoyroche.com/property/chevry-architectural-design/
It works ! but on the smartphone top (email a friend, pdf), the elements do not set properly how I could improve this?
I add a contact form that does not display correctly on smartphone (it is inserted with an editor widget) see link: http://savoyroche.com/contact/
How should I do ?
Hi Alpine Lodges
You can fix/change this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.
@media(max-width:780px) { #panel-1401-0-1-0 p[style]{ text-align: left !important; } }You might also need to install the SiteOrigin CSS Editor.
I’m not certain the mobile contact form issue relates to Page Builder. Try the form in a regular page that isn’t using Page Builder and see if the mobile issue persists.
Thank you for your help !
I will contact the contact form plugin support 7.
All the best :)