WordPress.org

Support

Support » Reviews » Awesome!

Awesome!

  • Ok, i installed your plugin with the twentytwelve theme and saw that when viewing it in a mobile resolution the columns skews accordingly and honestly this is not the expected behaviour (IMHO) so i found a solution, may be a not-so-clean one but it works pretty well.

    For having the columns stacked when you are on mobile simply add these lines on the shortcodes.css file after line 90 and before /* Media */ :

    * STACKABLE COLUMNS FOR TWENTY TWELVE */
    
    @media only screen and (max-width:481px) {
    
    body .simnor-shortcode-cols {
    	display: block;
    	overflow: hidden;
    	clear: both;
    	margin: 0 0 20px 0;
    }
    	body .simnor-shortcode-col {
    		float: left;
    		display: block;
    	}
    		body .simnor-shortcode-col-inner {
    			margin: 0 15px 0 0;
    		}
    
    	body .simnor-shortcode-cols-half-half .simnor-shortcode-col-a,
    	body .simnor-shortcode-cols-half-half .simnor-shortcode-col-b { width: 100%; }
    
    	body .simnor-shortcode-cols-third-third-third .simnor-shortcode-col-a,
    	body .simnor-shortcode-cols-third-third-third .simnor-shortcode-col-b,
    	body .simnor-shortcode-cols-third-third-third .simnor-shortcode-col-c { width: 100%; }
    
    	body .simnor-shortcode-cols-twothirds-third .simnor-shortcode-col-a { width: 100%; }
    	body .simnor-shortcode-cols-twothirds-third .simnor-shortcode-col-b { width: 100%; }
    
    	body .simnor-shortcode-cols-third-twothirds .simnor-shortcode-col-a { width: 100%; }
    	body .simnor-shortcode-cols-third-twothirds .simnor-shortcode-col-b { width: 100%; }
    
    	body .simnor-shortcode-cols-quarter-quarter-quarter-quarter .simnor-shortcode-col-a,
    	body .simnor-shortcode-cols-quarter-quarter-quarter-quarter .simnor-shortcode-col-b,
    	body .simnor-shortcode-cols-quarter-quarter-quarter-quarter .simnor-shortcode-col-c,
    	body .simnor-shortcode-cols-quarter-quarter-quarter-quarter .simnor-shortcode-col-d { width: 100%; }
    
    	body .simnor-shortcode-cols-half-quarter-quarter .simnor-shortcode-col-a { width: 100%; }
    	body .simnor-shortcode-cols-half-quarter-quarter .simnor-shortcode-col-b,
    	body .simnor-shortcode-cols-half-quarter-quarter .simnor-shortcode-col-c { width: 100%; }
    
    	body .simnor-shortcode-cols-quarter-quarter-half .simnor-shortcode-col-a,
    	body .simnor-shortcode-cols-quarter-quarter-half .simnor-shortcode-col-b { width: 100%; }
    	body .simnor-shortcode-cols-quarter-quarter-half .simnor-shortcode-col-c { width: 100%; }
    
    	body .simnor-shortcode-cols-quarter-half-quarter .simnor-shortcode-col-a,
    	body .simnor-shortcode-cols-quarter-half-quarter .simnor-shortcode-col-c { width: 100%; }
    	body .simnor-shortcode-cols-quarter-half-quarter .simnor-shortcode-col-b { width: 100%; }
    
    }
  • The topic ‘Awesome!’ is closed to new replies.