Working with adaptive design

For one of my projects, I need assistance with adaptive design. For my mobile devices, I actually want a different layout from what I have on my PC. What course of action should I take? #css #conquering-responsive-layout
10 Replies
Jochem
Jochem15mo ago
with the amount of details you've provided, all I can say in answer is "use media queries"
Animator#20
Animator#2015mo ago
I want a complete different layout for mobile devices compare to layout which i have created for desktop. And sadly with media queries I can't achieve that
Jochem
Jochem15mo ago
then add markup so you can, or else you'll have to use some kind of server-side logic to fetch different markup depending on the user agent
Animator#20
Animator#2015mo ago
Can u give me some reference i never worked with adaptive designs
Jochem
Jochem15mo ago
sorry, me neither you can do a lot with media queries, including changing the order elements appear in if you're using grid or flex, so there's very little you'd need actual different markup for
Animator#20
Animator#2015mo ago
Could u please tell me how can i use media queries to bring the canvas at the centre and the sidebar downwards in mobile devices
Animator#20
Animator#2015mo ago
Animator#20
Animator#2015mo ago
I would like to achieve design similar to this
Jochem
Jochem15mo ago
Someone else might be able to, but only if you share your code
Chris Bolson
Chris Bolson15mo ago
I think that your best option is to use grid-template areas as these can be defined however you like with media queries and this allows you to place the elements wherever you want. Here is an example https://codepen.io/cbolson/pen/gOQNNVr
Want results from more Discord servers?
Add your server