responsive-design Questions

2

I am absolutely desperate with this problem. I fully understand the concept of mobile-first and have been able to make the layout of my website responsive, however, the font-size does not change wh...
Vaginate asked 31/12, 2021 at 10:46

4

Solved

I am trying to get my 2 divs (which are side by side) to change to stacked divs when viewed on mobile as shown in the fiddle, but I would like "two to be on top and "one" to be second. Here is the...
Costanzia asked 10/7, 2015 at 14:49

3

Solved

I'm building an editor where the content of a post is loaded in a div, and jQuery selectors allow me to edit the content inline. I just ran into a bit of a hurdle as I was trying to add some respo...
Archil asked 1/9, 2011 at 14:28

5

I've been working with tailwind in my Vue project and overall its really good, but its a bit annoying to always write sm:w-10 lg:w-10 2xl:w-30 (etc) for all of my classes. So I was thinking, since ...
Mush asked 1/4, 2022 at 9:19

3

Solved

Currently I have some large text on a page, and layout works fine for short text (~12-14 chars in length), but any more than that will overflow or wrap. This is undesirable, so I'd like the size to...
Pulpwood asked 4/6, 2014 at 4:32

5

I know how to change the background and the the colour of the progress. I want to change the colour of the path of the progress before it fill in export const CircleProgress = withStyles(() => ...
Concretion asked 1/7, 2021 at 7:11

9

Solved

Designs commonly have smaller headline fonts for mobile designs. Does Material UI have a mechanism for making the typography responsive? I see that the default theme has the font sizes defined in r...
Shippee asked 24/9, 2018 at 3:35

6

Solved

How do we space out media queries accurately to avoid overlap? For example, if we consider the code: @media (max-width: 20em) { /* for narrow viewport */ } @media (min-width: 20em) and (max-wid...
Tola asked 5/11, 2012 at 22:37

3

Solved

Our client wants to have a different banner image on smaller screens than on larger screens. Not just shrink/stretch to fit, but actually substitute a different image. The full-size image is fairly...
Classmate asked 26/3, 2014 at 17:21

4

Solved

I have table that renders inside a panel which is inside a modal. As the table is relatively large, I'd like to restrict it's rows to say 5 so that the modal does not become scrollable. I looked th...

13

Solved

I have HTML similar to this: <div class="table-responsive"> <table class="table borderless"> <caption> <h3>Announcements</h3> </caption> <tbody> &l...

3

Solved

I have a table with the following markup: <div class="table-responsive" <table class="table table-hover" <!-- table data--> </table> </div> As the documentation says, ...

3

Solved

I can't seem to figure this one out, hopefully you guys can help. When I load my website, it opens up at the bottom of the page. I thought it may be the smooth scroll js script or the parallax sc...
Hedda asked 18/4, 2014 at 13:49

4

Solved

I am trying to create a mobile friendly version of my website, to make my website responsive to a smaller screen size and scale accordingly. I've created some media queries, that behave correctly ...
Resolutive asked 21/10, 2012 at 22:15

4

Does anyone know why my media queries code doesn't work ? <div class="box"></div> .box { background-color: red; width: 100%; height: 50px; } @media only screen and (max-...
Yardmaster asked 29/1, 2014 at 20:31

3

I have designed my app initially for the iPad and am now wanting to add functionality for an iPhone too. Is there a way to check what the device being used is, and then display a view accordingly? ...
Danika asked 20/1, 2021 at 13:16

7

Solved

I'm trying to make my responsive CSS styles work only on tablets and smartphones. Basically I have a style for desktop, a style for mobile: portrait and a style for mobile: landscape. I don't want ...
Odometer asked 25/2, 2013 at 6:49

7

Solved

I'm using Facebook's "Page Plugin" widget. On Facebook's page, it is written: If you want to adjust the plugin's width on window resize, you manually need to rerender the plugin. How can I dyn...
Feathered asked 6/5, 2015 at 17:44

6

Solved

My goal is to create a responsive grid with an unknown amount of items, that keep their aspect ratio at 16 : 9. Right now it looks like this: .grid { display: grid; grid-template-columns: ...
Mammalogy asked 29/7, 2018 at 6:23

34

Solved

I want to create a responsive div that can change its width/height as the window's width changes. Are there any CSS rules that would allow the height to change according to the width, while maintai...
Diu asked 29/9, 2009 at 23:11

3

One of the most annoying things I encounter on a daily basis is constantly having to reset the zoom of the chrome device emulator. For whatever reason, each time I change the device selection, the...

5

Solved

It is possible to fit and center a square div in the viewport and always maintain it's aspect ratio according to width and height? Requirements : only CSS the size of the square must adapt to th...
Norm asked 13/5, 2014 at 11:34

3

Solved

I have a website that includes header images. However these header images do not seem to load at first when I load the website in Firefox or Safari on iOS. Here’s a screenshot: This is the code fo...

3

Solved

i am trying to make a responsive multi column text aria with bootstrap. i tried looking online but could not find what i need. this is an example of what i am trying to do, but i would like to mak...
Testee asked 16/4, 2015 at 6:12

16

Solved

I installed Google Recaptcha in a site (not a Wordpress site or Joomla) So do not offer any WP plugins or Joomla Extension :) My problem is, the site is responsive and recaptcha is not. When I us...
Distal asked 10/4, 2014 at 15:7

© 2022 - 2025 — McMap. All rights reserved.