Breaking News: Grepper is joining You.com. Read the official announcement!

responsive

Add Answer

Inexpensive Ibex answered on April 26, 2020 Popularity 10/10 Helpfulness 2/10

answer responsive

related what is responsive design

related responsive design

responsive

Comment

Responsive website, specify width
.container{
    max-width:960px;
    width:100%;
    margin:0 auto;
}

Popularity 10/10 Helpfulness 2/10 Language css

Source: Grepper

Tags: css responsive

Link to this answer
Share Copy Link

Contributed on Sep 01 2022

Inexpensive Ibex

0 Answers Avg Quality 2/10

Closely Related Answers

what is responsive design

Comment

/* Answer to: "what is responsive design" */

/*
  Responsive web design is an approach to web design that makes
  web pages render well on a variety of devices and window or screen
  sizes. Recent work also considers the viewer proximity as part of
  the viewing context as an extension for RWD.

  In other words, it makes your website look nice on all devices.

  To learn Responsive Web Design head over to W3Schools tutorial:
  https://www.w3schools.com/css/css_rwd_intro.asp
*/

Popularity 10/10 Helpfulness 3/10 Language css

Source: en.wikipedia.org

Tags: css

Link to this answer
Share Copy Link

Contributed on Apr 26 2020

TigerYT

0 Answers Avg Quality 2/10

responsive design

Comment

- Website fits the device that is used to access it
- Multiple pixels are combined into one logical pixel for specified device
- 3 techniques:
    1. Flexible grids : in percentage values
        - column : screen split into multiple vertical portions
        - gutter : space between columns
        - margins : left and right edge of screen
    2. Fluid images:
        - set maximum or minimum CSS property of image with percentage
        - eg : `max-width : 100%`
        - It will scale down if the grid become smaller, but it will never be overflown
    3. Media queries :
        - Allows developer to query display size, orientation and aspect ratio
        - CSS rule
        - example : `@media only screen and (max-width: 700px){...}`
- Breakpoint :
    -  pixel value specified for different size of devices.  
    - eg: Bootstrap breakpoints: extra small, large, extra large etc.
- function around 3 grids
    1. Fixed grid : column widths are fixed, margin is flexible (Remaining space is occupied by margin)
    2. Fluid grid : column widths can grow or shrink to adapt, gutter is fixed
    3. Hybrid grid: Columns have both fluid width and fixed width components

Popularity 10/10 Helpfulness 3/10 Language css

Source: Grepper

Tags: css

Link to this answer
Share Copy Link

Contributed on Dec 23 2023

Innocent Iguana

0 Answers Avg Quality 2/10

responsive

Contents

More Related Answers

responsive

Closely Related Answers

what is responsive design

responsive design

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.