Strange Margins and Paddings in Firefox

[gabrieldesign]

Hi there

Please have a look at those two screenshots. The website isn’t online yet, but you can have a look at it under https://neu.onecodex.ch. When you visit the site with chrome or safari, then everything looks great, but in firefox, there is a mistake in the text-box. There is too much padding/margin on the bottom and no padding/margin at the top.

Thanks for your help

[rad]

Hi there,

Thanks for posting in.

It’s because of the transform styling, please add this CSS to your global custom CSS.

.x-column {
transform: none !important;
}

Hope this helps.

[gabrieldesign]

@Rad

.x-column {
transform: none !important;
}

Sorry, I adjusted the css with these 3 lines, but there aren’t any improvements in firefox. There is still no margin/padding at the top, but too much margin/padding at the bottom:

[paul.r]

Hi,

Try to disable marginless column of your row element.

Thanks

[gabrieldesign]

Okay, thanks for that. I deactivated the marginless columns and adjusted my css and somehow it worked. But if I would like to have 2 sections that touch each other in the middle, then i have to do that with marginless columns, right? And if i use marginless columns, then it doesn’t look that great in firefox. Anyway, thanks a lot for your help

[ruenel]

Hello There,

Thanks for writing in! Marginless columns will make two or more columns touch each other. You may add padding in the column if you want to give a little space between them. It may not look great in all browsers if all your column contents is close enough touching each other so a little padding would help.

If you need anything else we can help you with, don’t hesitate to open another thread.