[Bartosz MParticipant]

Hi,

I wonder, if that would be possible to adjust margins to be more suitable for smaller screens (mobile devices). If you look at my home page http://mycie.biz/ you see nice margins on desktops and they adjust nicely when you use a mobile. However, if you look at page http://mycie.biz/realizacje/ even though margin is lower than at home page on a desktop when you open on a mobile the margin doesn’t adjust proportionally and remain very large (the settings are
[vc_row padding_top=”0px” padding_bottom=”0px” border=”all” inner_container=”true” bg_color=”#ffffff” class=”mtl mbl mll mrl”]
)
I would very much appreciate your help because I could not find good solution myself.

[AmanMember]

Hi Bartosz,

Which margins specifically are you referring though? If you meant the “height” of the boxes then they vary because of the difference in the amount of content in each. If not, please specify which margins exactly.

Thanks.

[Bartosz MParticipant]

Hi,

Thanks for addressing my question. I mean margins on the left and right. If you have a look at my site http://mycie.biz/ using a mobile (narrow screen) you will notice that home page looks good but other pages have unecessary large margins reducing the space for content. On desktops all look good. I’m using large margins for Content Bands (class=”mtl mbl mll mrl”) for pages “Realizacje” and “Kontakt”. For the homepage, I’m using content bands within content bands with inner conteiners set to on and no adjustments for margins. Thanks

[RadModerator]

Hi Bartosz,

The more suitable fix for this is having a container with uniform margin all across the site. Using blank template with no container means you have to compose your own container and spacing. Even if we add fixes on these two area, there is possibility that it won’t work on other pages and will have to repeat each fixes every content you will add.

Then, set your page template to default and modify your content layout sizes at Customizer > {Your Current Stack}

Hope this helps.

[Bartosz MParticipant]

Hi, you are right that setting layout with container helps with margins and I’ve tested this option before. However this option doesn’t fit 100% my purpose- if I choose layout with container I will not be able to separate two galleries as good as with two containers. Secondly the container layout doesn’t fit the concept of the homepage.

I’ve solved this issue by adding the following classes :

@media screen and (max-width: 479px) {
.margin {
margin-left: 18px; margin-right: 18px; margin-top: 18px; margin-bottom: 18px;
}
}

@media screen and (min-width: 480px) {
.marginl {
margin-left: 28px; margin-right: 28px; margin-top: 28px; margin-bottom: 28px;
}
}

So far looks good:-) Thanks

[AmanMember]

Hi Bartosz,
Good to know that you could solve the issue. Please contact us again if you need help.

Thanks!

[Author]

Posts