css - making stackable two columns in WordPress -
i'm working theme supposed responsive when 2 column shortcode used , page viewed on smaller browsers or mobiles, columns shrink fit browsers width side side instead of stacking.
it looks awful on smartphones, trying make columns stack.
you can see page at: http://goo.gl/t8qoa5
relevant css:
.one_half { float:left; line-height:22px; margin-right:2%; width:49%; margin-bottom:27px; display:block } .one_half_last { float:left; line-height:22px; width:49%; margin-bottom:27px; display:block }
use media queries write conditional css based on width of viewport. https://developer.mozilla.org/en-us/docs/web/guide/css/media_queries
example:
@media (max-width: 480px) { .one_half, .one_half_last { width: 100%; } }
Comments
Post a Comment