Skip to main content

[css] easy responsive work

// Extra small screen / phone
// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1
@screen-xs:                  480px;
@screen-xs-min:              @screen-xs;
@screen-phone:               @screen-xs-min;

// Small screen / tablet
// Note: Deprecated @screen-sm and @screen-tablet as of v3.0.1
@screen-sm:                  768px;
@screen-sm-min:              @screen-sm;
@screen-tablet:              @screen-sm-min;

// Medium screen / desktop
// Note: Deprecated @screen-md and @screen-desktop as of v3.0.1
@screen-md:                  992px;
@screen-md-min:              @screen-md;
@screen-desktop:             @screen-md-min;

// Large screen / wide desktop
// Note: Deprecated @screen-lg and @screen-lg-desktop as of v3.0.1
@screen-lg:                  1200px;
@screen-lg-min:              @screen-lg;
@screen-lg-desktop:          @screen-lg-min;

// So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-sm-min - 1);
@screen-sm-max:              (@screen-md-min - 1);
@screen-md-max:              (@screen-lg-min - 1);


// 1200 ~
@media (min-width: @screen-lg-min) {
}
// 992 ~ (1200-1)
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
}
// 768 ~ (992-1)
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
}
// 480 ~ (768-1)
@media (min-width: @screen-xs-min) and (max-width: @screen-xs-max) {
}
// ~ (480-1)
@media (max-width: (@screen-xs - 1)) {
}


Comments

Popular posts from this blog

Browser User Agent List

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36 Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36 Mozilla/5.0 (Windows NT 6.1; WOW64; rv:45.0) Gecko/20100101 Firefox/45.0 Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36 Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/601.4.4 (KHTML, like Gecko) Version/9.0.3 Safari/601.4.4 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/601.5.17 (KHTML, like Gecko) Version/9.1 Safari/601.5.17 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36 Mozilla/5.0 (Windows NT 10.0; WOW64; rv:45.0) Gecko/20100101 Firefox/45.0 Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0;...

[linux] Adjusting child processes for PHP-FPM (Nginx)

Adjusting child processes for PHP-FPM (Nginx) Problem: The following warning message appears in the logs: [26-Jul-2012 09:49:59] WARNING: [pool www] seems busy (you may need to increase pm.start_servers, or pm.min/max_spare_servers), spawning 32 children, there are 8 idle, and 58 total children [26-Jul-2012 09:50:00] WARNING: [pool www] server reached pm.max_children setting (50), consider raising it It means that there are not enough PHP-FPM processes. Solution: We need to calculate and change these values based on the amount of memory on the system: /etc/php-fpm.d/www.conf pm.max_children = 50 pm.start_servers = 5 pm.min_spare_servers = 5 pm.max_spare_servers = 35 - the following command will help us to determine the memory used by each (PHP-FPM) child process: ps -ylC php-fpm --sort:rss The RSS column shows non-swapped physical memory usage by PHP-FPM processes in kilo Bytes. On an average each PHP-FPM process took ~75MB of RAM on my machine. Appropriate valu...

[symfony] Assert in Entity

* @Assert\NotBlank() * @Assert\Blank() * @Assert\NotNull() * @Assert\Null() * @Assert\True(message = "The token is invalid") * @Assert\False( *     message = "You've entered an invalid state." * ) * @Assert\Type(type="integer", message="The value {{ value }} is not a valid {{ type }}.") is_ array bool callable float double int integer long null numeric object real resource scalar string ctype_ alnum alpha cntrl digit graph lower print punct space upper xdigit * @Assert\Email( *     message = "The email '{{ value }}' is not a valid email.", *     checkMX = true * ) * @Assert\Length( *      min = 2, *      max = 50, *      minMessage = "Your first name must be at least {{ limit }} characters long", *      maxMessage = "Your first name cannot be longer than {{ limit }} characters long" * ...