Showing posts with label responsive design. Show all posts
Showing posts with label responsive design. Show all posts

Monday, February 1, 2016

Don't wrap specific CSS elements

Another quickie quickie CSS tricky:

Let’s say you’re trying to make a site responsive to many different screen sizes, like you have to these days. You have a block of text that needs to wrap, but you also have a word or number you don’t want to get wrapped. The best example for this I can think of is a phone number – you don’t want it display weird like this:

    Call Jenny today! 800-867-
    5309

Wrap that word or number or whatever in a span and style it with "white-space: nowrap;". Then, that particular element will wrap as one piece:

    Call Jenny today! 
    800-867-5309

Monday, October 19, 2015

Device Emulators all up in your browser

File this one under the "n00b" tag.

For checking responsiveness on mobile, Chrome (and probably Firefox) has some sweet device emulators.

Go to Developer Tools, then click the little phone icon in the far left of the Developer Tools nav
and it will let you select whatever device to see how the current page looks.

Wow. Much responsive. Very browser.