Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

General Discussion

Posted by troy beckett
troy beckett
12,035 Points

getting exact pixel width of browser??

At the moment I'm trying to figure out exact breakpoints for my website to use with media queries.

One thing I can't work out that would be really helpful is knowing the exact pixel width of the browser at the current size I have it.

I added the chrome extension 'Browser Width' which I thought was the solution but after some testing the results it gives are always about +20px to wide.

3 Answers

Jaro Schwab
Jaro Schwab
8,957 Points
Jaro Schwab
Jaro Schwab
8,957 Points

Hello.

You could use Javascript to figure this out. Just type

window.innerWidth

into your dev Tool console and you should get the exact pixel width.

Lisa Wells
Lisa Wells
1,082 Points
Lisa Wells
Lisa Wells
1,082 Points

In Chrome, if you have Developer Tools open, the browser dimensions are displayed on the top right of your browser window as you change size. I doesn't stick, but I've found it useful while determining breakpoints.

troy beckett
troy beckett
12,035 Points

yeah thats what I'm currently using I found this website www.responsivepx.com seems pretty cool

Lisa Wells
Lisa Wells
1,082 Points
Lisa Wells
Lisa Wells
1,082 Points

Nice!