Stack Overflow
Stack Overflow

Questions tagged [responsiveness]

Responsiveness describes the ability of an UI element or dialog to respond on user interaction within an acceptable time frame.

Responsiveness describes the ability of an UI element or dialog to respond on user interaction within an acceptable time frame.

413 questions
-1
votes
2 answers

Responsive Design: reduce breakpoints

I always wondered if we could reduce breakpoints in a responsive design. Here is a simple example. I have a form containing text inputs. The normal way for responsiveness would be to have many breakpoints for example large laptop, laptop, tablet,…
Gabriel Beauchemin-Dauphinais
  • 181
  • 2
  • 14
-1
votes
1 answer

Excess space on HTML page

There's an excess space to the right side of my landing page on mobile view. You can check it out on https://yole-dev.github.io/floorpro.ngpro/ I have checked my CSS to see if I had accidentally set a padding-right or margin-right on the body but I…
Yole
  • 1
-1
votes
1 answer

How do I adapt the
height to the page when I zoom in and out?

I am learning HTML and CSS and I am trying to replicate the homepage of flickr.com. I can't get the central part of my page ("Find your inspiration") to stay centered when I zoom in and out. I can't get the content to responsively fill the…
BillyBango
  • 5
  • 3
-1
votes
1 answer

How to draw responsive rectanges inside fixed size rectangle in HTML and CSS?

I can draw such inner rectanges inside fixed size rectange but these are not responsive. Test…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/responsive-design" class="post-tag grid--cell" title="show questions tagged 'responsive-design'" rel="tag">responsive-design</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked May 28 '22 at 08:52">asked May 28 '22 at 08:52</time> <a href="../../users/1762051/alok" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/1762051.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Alok" /> </a> <div class="s-user-card--info"> <a href="../../users/1762051/alok" class="s-user-card--link">Alok</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">7,734</li> <li class="s-award-bling s-award-bling__gold" title="8 gold badges">8</li> <li class="s-award-bling s-award-bling__silver" title="55 silver badges">55</li> <li class="s-award-bling s-award-bling__bronze" title="100 bronze badges">100</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-69633968"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/69633968/how-else-can-i-review-the-responsiveness-of-a-local-hosted-app-without-using-d" class="question-hyperlink">How else can I review the responsiveness of a local hosted app without using dev tools?</a></h3> <div class="excerpt">I'm working on an app on my machine and run it on local host. Sometimes browsers dev tools are not accurate and once I am making the changes in my code and then run, it doesn't look like how it was in dev tools. I'm talking about some alignment,…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/devtools" class="post-tag grid--cell" title="show questions tagged 'devtools'" rel="tag">devtools</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> <a href="../../questions/tagged/google-developer-tools" class="post-tag grid--cell" title="show questions tagged 'google-developer-tools'" rel="tag">google-developer-tools</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Oct 19 '21 at 15:48">asked Oct 19 '21 at 15:48</time> <a href="../../users/12918520/alex" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/12918520.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Alex" /> </a> <div class="s-user-card--info"> <a href="../../users/12918520/alex" class="s-user-card--link">Alex</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">1</li> <li class="s-award-bling s-award-bling__bronze" title="1 bronze badges">1</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-69004950"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status answered-accepted"> <strong>2</strong> answers </div> </div> </div> <div class="summary"> <h3><a href="../../questions/69004950/how-to-remove-page-scrolling-to-the-left-because-of-a-photo" class="question-hyperlink">How to remove page scrolling to the left because of a photo?</a></h3> <div class="excerpt">Currently, I am trying to fit (crop) image on the mobile version of the website, but, with no results... How it looks on a desktop - How it looks on a mobile - Image crops on mobile because position: absolute; margin-left: 50%;, but..., this page…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/image" class="post-tag grid--cell" title="show questions tagged 'image'" rel="tag">image</a> <a href="../../questions/tagged/mobile" class="post-tag grid--cell" title="show questions tagged 'mobile'" rel="tag">mobile</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card__deleted"> <time class="s-user-card--time" datetime="asked Aug 31 '21 at 20:26">asked Aug 31 '21 at 20:26</time> <div class="s-avatar s-avatar__32 s-user-card--avatar"> </div> <div class="s-user-card--info">user15066075</div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-55590550"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status answered-accepted"> <strong>2</strong> answers </div> </div> </div> <div class="summary"> <h3><a href="../../questions/55590550/is-it-unprofessional-to-use-media-screen-in-css" class="question-hyperlink">Is it unprofessional to use @media screen in css</a></h3> <div class="excerpt">I am trying to make my site responsive and was originally planning on using @media screen property in CSS, in order to optimise it for mobile devices. I'm already using bootstrap but want to modify parts of it (which I have been doing using @media…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/media-queries" class="post-tag grid--cell" title="show questions tagged 'media-queries'" rel="tag">media-queries</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Apr 09 '19 at 10:22">asked Apr 09 '19 at 10:22</time> <a href="../../users/7861554/jgh" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/7861554.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="jgh" /> </a> <div class="s-user-card--info"> <a href="../../users/7861554/jgh" class="s-user-card--link">jgh</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">88</li> <li class="s-award-bling s-award-bling__silver" title="1 silver badges">1</li> <li class="s-award-bling s-award-bling__bronze" title="8 bronze badges">8</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-52909101"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/52909101/visual-composer-responsiveness" class="question-hyperlink">Visual Composer Responsiveness</a></h3> <div class="excerpt">I'm having issues with this plugin. I'm trying to convert 3 columns to 2 columns for responsiveness in smaller devices. When ever I change the 3 columns to 2 columns from the responsive tab, it pushes the 4th item into third row. Not only that they…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/wordpress" class="post-tag grid--cell" title="show questions tagged 'wordpress'" rel="tag">wordpress</a> <a href="../../questions/tagged/visual-composer" class="post-tag grid--cell" title="show questions tagged 'visual-composer'" rel="tag">visual-composer</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Oct 20 '18 at 18:58">asked Oct 20 '18 at 18:58</time> <a href="../../users/10405005/raja-ehsan-raza" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/10405005.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Raja Ehsan Raza" /> </a> <div class="s-user-card--info"> <a href="../../users/10405005/raja-ehsan-raza" class="s-user-card--link">Raja Ehsan Raza</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">1</li> <li class="s-award-bling s-award-bling__bronze" title="1 bronze badges">1</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-50687435"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/50687435/make-movie-cards-responsive" class="question-hyperlink">Make movie cards responsive</a></h3> <div class="excerpt">Hello Stackoverflow community, I want to make my movie cards responsive but I have troubles with it... I simply don't know where to start to make it responsive. Questions like which css properties do I need etc etc... I want to have the cards…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/responsive-design" class="post-tag grid--cell" title="show questions tagged 'responsive-design'" rel="tag">responsive-design</a> <a href="../../questions/tagged/responsive" class="post-tag grid--cell" title="show questions tagged 'responsive'" rel="tag">responsive</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Jun 04 '18 at 19:21">asked Jun 04 '18 at 19:21</time> <a href="../../users/9889221/stevebergosso" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/9889221.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="SteveBergosso" /> </a> <div class="s-user-card--info"> <a href="../../users/9889221/stevebergosso" class="s-user-card--link">SteveBergosso</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">1</li> <li class="s-award-bling s-award-bling__bronze" title="2 bronze badges">2</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-48898545"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/48898545/elements-get-out-of-the-div-on-making-the-screen-responsive" class="question-hyperlink">Elements get out of the div on making the screen responsive</a></h3> <div class="excerpt">I have the following block of code, The problem with this is that it tends to get out of the aircard div when making the screen responsive, I dont know for what reason as shown in the picture,whereas they should stack over one another. What's the…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/bootstrap-4" class="post-tag grid--cell" title="show questions tagged 'bootstrap-4'" rel="tag">bootstrap-4</a> <a href="../../questions/tagged/responsive" class="post-tag grid--cell" title="show questions tagged 'responsive'" rel="tag">responsive</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Feb 21 '18 at 05:08">asked Feb 21 '18 at 05:08</time> <a href="../../users/7791253/shahrukh-nasir" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/7791253.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Shahrukh Nasir" /> </a> <div class="s-user-card--info"> <a href="../../users/7791253/shahrukh-nasir" class="s-user-card--link">Shahrukh Nasir</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">1</li> <li class="s-award-bling s-award-bling__bronze" title="1 bronze badges">1</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-45345293"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/45345293/how-progressive-apps-are-different-from-fully-responsive-sites" class="question-hyperlink">How Progressive Apps are different from fully responsive sites?</a></h3> <div class="excerpt">Could someone elaborate on how Progressive web Apps are different from fully responsive sites? </div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Jul 27 '17 at 08:28">asked Jul 27 '17 at 08:28</time> <a href="../../users/5337604/ema" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/5337604.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Ema" /> </a> <div class="s-user-card--info"> <a href="../../users/5337604/ema" class="s-user-card--link">Ema</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">29</li> <li class="s-award-bling s-award-bling__silver" title="1 silver badges">1</li> <li class="s-award-bling s-award-bling__bronze" title="6 bronze badges">6</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-41229862"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/41229862/the-responsiveness-do-not-work-when-i-use-a-bootstrap" class="question-hyperlink">The responsiveness do not work when I use a Bootstrap</a></h3> <div class="excerpt">At the desktop the website looks good but when I try to reduce the screen to small resolutions the element is mixing one with others and looking really bad. For example: Images repeat itself and not steched, as I would expect Text are on a contant…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/twitter-bootstrap" class="post-tag grid--cell" title="show questions tagged 'twitter-bootstrap'" rel="tag">twitter-bootstrap</a> <a href="../../questions/tagged/responsive-design" class="post-tag grid--cell" title="show questions tagged 'responsive-design'" rel="tag">responsive-design</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Dec 19 '16 at 19:42">asked Dec 19 '16 at 19:42</time> <a href="../../users/6799243/yulia-etnarovich" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/6799243.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Yulia Etnarovich" /> </a> <div class="s-user-card--info"> <a href="../../users/6799243/yulia-etnarovich" class="s-user-card--link">Yulia Etnarovich</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">31</li> <li class="s-award-bling s-award-bling__bronze" title="2 bronze badges">2</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-40158650"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/40158650/slow-loading-and-responsiveness" class="question-hyperlink">Slow loading and responsiveness</a></h3> <div class="excerpt">Our app loads extremely slowly, especially the pictures, and the developer has not been able to come up with a solution to this. The movements are slow and the buttons are slow in response (works on the 2nd or 3rd press). The stability is terrible,…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/loading" class="post-tag grid--cell" title="show questions tagged 'loading'" rel="tag">loading</a> <a href="../../questions/tagged/hybrid" class="post-tag grid--cell" title="show questions tagged 'hybrid'" rel="tag">hybrid</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> <a href="../../questions/tagged/stability" class="post-tag grid--cell" title="show questions tagged 'stability'" rel="tag">stability</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked Oct 20 '16 at 15:28">asked Oct 20 '16 at 15:28</time> <a href="../../users/7048743/hannah-charlotte" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/7048743.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Hannah Charlotte" /> </a> <div class="s-user-card--info"> <a href="../../users/7048743/hannah-charlotte" class="s-user-card--link">Hannah Charlotte</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">1</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-37075326"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>1</strong> answer </div> </div> </div> <div class="summary"> <h3><a href="../../questions/37075326/media-query-is-not-recognized-by-browser-or-mobile-device" class="question-hyperlink">media query is not recognized by browser or mobile device</a></h3> <div class="excerpt">I'm trying to create a responsive layout, but for some reason, when I wrap the relevant CSS in a media query, it isn't recognized: i.e., if I resize my browser window or check it out on my iPhone, the CSS is not applied. I'm not sure what I'm doing…</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/wordpress" class="post-tag grid--cell" title="show questions tagged 'wordpress'" rel="tag">wordpress</a> <a href="../../questions/tagged/responsive-design" class="post-tag grid--cell" title="show questions tagged 'responsive-design'" rel="tag">responsive-design</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card"> <time class="s-user-card--time" datetime="asked May 06 '16 at 14:46">asked May 06 '16 at 14:46</time> <a href="../../users/1422638/christina-huggins-ramey" class="s-avatar s-avatar__32 s-user-card--avatar"> <img class="s-avatar--image" src="../../users/profiles/1422638.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Christina Huggins Ramey" /> </a> <div class="s-user-card--info"> <a href="../../users/1422638/christina-huggins-ramey" class="s-user-card--link">Christina Huggins Ramey</a> <ul class="s-user-card--awards"> <li class="s-user-card--rep" title="reputation score">593</li> <li class="s-award-bling s-award-bling__gold" title="2 gold badges">2</li> <li class="s-award-bling s-award-bling__silver" title="6 silver badges">6</li> <li class="s-award-bling s-award-bling__bronze" title="14 bronze badges">14</li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="mln24"> <div class="question-summary" id="question-summary-37028214"> <div class="statscontainer"> <div class="stats"> <div class="vote"> <div class="votes"> <span class="vote-count-post"><strong>-1</strong></span> <div class="viewcount">votes</div> </div> </div> <div class="status "> <strong>5</strong> answers </div> </div> </div> <div class="summary"> <h3><a href="../../questions/37028214/how-to-shrink-the-whole-page-to-center-when-it-is-zoomed-out" class="question-hyperlink">How to shrink the whole page to center when it is zoomed out?</a></h3> <div class="excerpt">If the page is zoomed out , how can i shrink the webpage and all of its content to center? This is before zooming out. This is after zooming out How to shrink to center of the page while zooming out? Code im using is …</div> <div class="grid ai-start jc-space-between fw-wrap"> <div class="grid gs4 fw-wrap tags "> <a href="../../questions/tagged/html" class="post-tag grid--cell" title="show questions tagged 'html'" rel="tag">html</a> <a href="../../questions/tagged/css" class="post-tag grid--cell" title="show questions tagged 'css'" rel="tag">css</a> <a href="../../questions/tagged/responsiveness" class="post-tag grid--cell" title="show questions tagged 'responsiveness'" rel="tag">responsiveness</a> <a href="../../questions/tagged/responsive" class="post-tag grid--cell" title="show questions tagged 'responsive'" rel="tag">responsive</a> </div> <div class="started mt0"> <div class="s-user-card s-user-card__deleted"> <time class="s-user-card--time" datetime="asked May 04 '16 at 12:43">asked May 04 '16 at 12:43</time> <div class="s-avatar s-avatar__32 s-user-card--avatar"> </div> <div class="s-user-card--info">user5571323</div> </div> </div> </div> </div> </div> </div> <div class="s-pagination pager fr"> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=25" rel="prev" title="Go to page 25">Prev </a> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=1" rel="" title="Go to page 1">1</a> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=2" rel="" title="Go to page 2">2</a> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=3" rel="" title="Go to page 3">3</a> <div class="s-pagination--item s-pagination--item__clear">…</div> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=27" rel="" title="Go to page 27">27</a> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=28" rel="" title="Go to page 28">28</a> <a class="s-pagination--item" href="../../questions/tagged/responsiveness_page=27" rel="next" title="Go to page 27"> Next</a> </div> </div> </div> </div> </div> <script src="../../static/js/stack-icons.js"></script> <script src="../../static/js/fromnow.js"></script> </body> </html>