Docs

[Studio172]

Hello, I have a question; for a responsive website I would like to set only one column to a minimum width, how should I do this?
greerings, Stefan

[Christopher]

Hi there,

Add a custom class like my-class to your column.

Please add following code in Customize -> Custom -> Global CSS :

@media (max-width:767px){

.my-class{
min-width:200px;
}
}

Hope it helps.

[Studio172]

Thanks i will try!

[Thai]

Let us know how it goes!

[Studio172]

Hello thanks, it works, but… now the column next to it gets pushed under the (min-width column)…

you see this here:
the second google map at the bottom of http://frank.pilihan.nl/

how can I make sure that doesn’t happen?

[Rad]

Hi there,

You should apply a width to your map’s column too. It’s like addition and subtraction, if you add more somewhere else, then you’ll have to reduce other columns width too. That’s to maintain the total width equal to its container width/

Thanks!

[Studio172]

Yes, but since the page is responsive… how do I explain that this column should use the leftover-space (width of the page minus width of the first column)?
Maybe this is a very stupid question… but my knowledge of css is sadly not very good…sorry…

[Rad]

Hi there,

Try this,

@media (max-width:767px){

.my-class{
min-width:200px;
}

.my-class2{
min-width: calc(96% - 200px)
}

}

Then use my-class2 to your map column.

Hope this helps.

[Studio172]

Also does not seem to work…

[Christopher]

Hi there,

Please add right and left padding to last row.

Hope it helps.

[Author]

Posts