DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports Events Over 2 million developers have joined DZone. Join Today! Thanks for visiting DZone today,
Edit Profile Manage Email Subscriptions Moderation Admin Console How to Post to DZone Article Submission Guidelines
View Profile
Sign Out
Refcards
Trend Reports
Events
Zones
Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones AWS Cloud
by AWS Developer Relations
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones
AWS Cloud
by AWS Developer Relations

Trending

  • Hyperion Essbase Technical Functionality
  • Effortlessly Streamlining Test-Driven Development and CI Testing for Kafka Developers
  • Guide To Selecting the Right GitOps Tool - Argo CD or Flux CD
  • A Complete Guide to AWS File Handling and How It Is Revolutionizing Cloud Storage
  1. DZone
  2. Data Engineering
  3. Databases
  4. CSS Media Queries + Visual Studio = Easy

CSS Media Queries + Visual Studio = Easy

Robert Maclean user avatar by
Robert Maclean
·
Mar. 18, 15 · Interview
Like (0)
Save
Tweet
Share
5.60K Views

Join the DZone community and get the full member experience.

Join For Free

css media queries used to scare me. the problem is that i know css, but media queries look so much more complex & having to rely on browser tools to help get them correct was never a great experience. thankfully visual studio + web essentials has made great strides in making using media queries easier to use, so much so that now that i think they are kinda boring and i need a new thing to scare me… like closure

snippets

image web essentials has snippets for css media queries , and these are a great help. first there is the @media snippet which will get you setup with a basic media query. the real power though is in the device specific ones that produce a the right set of css & takes a lot of the searching for the right settings away.

browser link

i have demo’d browser link many times & written about it before – it is awesome. it gives any browser the ability to have a two way connection with visual studio. that means the browser can send data to visual studio, useful for detecting things that only happen when you render the dom. browser link + visual studio can also send data to the browser, for example telling the browser to refresh because the page has changed. since it works with any browser, you can have multiple browsers open and work with all of them at once. browser link isn’t an asp.net feature, it is a web + visual studio feature, so if you are using php or pure html (like i do in the video below) it just works.

for media queries, browser link can read the browser dimensions into visual studio, this means all you need to do is set the browser to the right size & press ctrl+space on the right property of the media query and it will show you the dimension the browser is at that very moment! it means that getting the exact right size of the browser window for sizing is trivial, since you can work visually in your browser and have all the power in your tools.

check out this video for how it works!

have you got any awesome features in visual studio that are kinda hidden? share them in the comments.

Media queries Database Media (communication) CSS

Published at DZone with permission of Robert Maclean, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

Trending

  • Hyperion Essbase Technical Functionality
  • Effortlessly Streamlining Test-Driven Development and CI Testing for Kafka Developers
  • Guide To Selecting the Right GitOps Tool - Argo CD or Flux CD
  • A Complete Guide to AWS File Handling and How It Is Revolutionizing Cloud Storage

Comments

Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 600 Park Offices Drive
  • Suite 300
  • Durham, NC 27709
  • support@dzone.com

Let's be friends: