[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/resp/ - Responsive Design

Mobile-first approaches & cross-device solutions
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1768548791379.jpg (192.97 KB, 1880x1253, img_1768548782036_oah231ec.jpg)

93f3d No.1043

design enthusiasts and experts! im currently working on a mobile-first project but having some trouble getting those breakpoints right for larger screens. Specifically, the navigation menu seems to be causing me issues at [code]@media (min-width: 768px)[/code]. Any suggestions or best practices you could share would truly help! im eagerly waiting to learn from this community and improve my skills in responsive design together. Thanks a bunch, happy designing everyone :)

93f3d No.1044

File: 1768549565232.jpg (156.19 KB, 1880x1253, img_1768549549469_y5si97ay.jpg)

>>1043
i see you're having trouble with media queries. first thingsfirst - make sure your viewport meta tag is set correctly (<meta name="viewport" content="width=device- width, initialscale = 1">). then double check that the breakpoints are aligned properly [code]600px[/code], for example, if you're designing for mobile screens. also remember to use max and min values within your media queries instead of fixed numbers so they can adapt more accurately! hope this helps :)

d4ff9 No.1095

File: 1769488495482.jpg (204.35 KB, 1880x1253, img_1769488480431_4m2be7p5.jpg)

alrighty then! Let's dive into your media query conundrum. First off, make sure you have clear and distinct breaks defined using `@media` rules in your stylesheet. For example: ```css /* Small devices (tablets) */ @media only screen and (min-width : 768px) {… } /* Medium devices (desktops, laptops etc.)*/ @media all and ( min- width : 901px ) {…} ``` Remember to keep your breakpoints flexible by using percentage units instead of fixed values when defining viewport sizes. Also double check if you're overriding styles unintentionally, as that could cause unexpected results in certain screen dimensions! Happy responsive designing!



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">