I have a site with a bar of links across the top. One of the links is titled ‘Who We Are’, witch throws the whole thing out of alignment, creating two lines. Anyway, after fixing this horrid error on mobile, I go back over to desktop: I’ve broken the bar into one glitchy mess of text. So I fix that, and go over to tablet, content with how it’s looking. As bad as desktop was, tablet is worse. So I look at all my formats and realize: at any one time, only 1 platform looks ok. I’m asking how to isolate platforms (Edits to mobile don’t affect desktop, etc.) to prevent this happening. Is there a way to do this with webflow, or was this a stupid waste of 3 hr to try to fix?
1 Like
Hey @SN0W the best way to create consistent styles across devices is to have your base styles in the desktop media query and then override those styles as you go down to smaller devices.
It sounds like your links at the top were display: inline which doesn’t contain the text, but allows it to wrap to the next line. The way to fix this is to make your nav links display: inline-block which will contain them into a block that behaves like it’s inline and won’t wrap over.
Let me know if this helps. If you post your public link I’d be able to help you out even more.