Exam 70-486 topic 1 question 101 discussion

Actual exam question from Microsoft's 70-486

Question #: 101
Topic #: 1

You are developing an ASP.NET MVC application. Devices that use many different browsers will use the application.
You have the following requirements:
✑ Content must display correctly when a device is in landscape or portrait orientation.
Content must not scale when the device orientation changes.

✑ Content must be displayed by using the maximum available screen space.
✑ The application must render properly in Internet Explorer 8 or later versions.
You need to configure the application.
Which two actions should you perform? Each correct answer presents part of the solution.

A. Use JavaScript to evaluate the window.innerWidth and window.innerHeight properties.
B. Set the value of the width property for the viewport meta tag to device-width.
C. Use CSS to target the HTML element on each page. Set the values of the width and height properties to 100%.
D. Use CSS media queries to target screen size, device orientation, and other browser capabilities.

Show Suggested Answer

Suggested Answer: BD 🗳️
B: If you want the viewport width to match the device's physical pixels, you can specify the following:
<meta name="viewport" content="width=device-width">
For this to work correctly, you must not explicitly force elements to exceed that width (e.g., using a width attribute or CSS property), otherwise the browser will be forced to use a larger viewport regardless.
D: Media queries in CSS3 extend the CSS2 media types idea: Instead of looking for a type of device, they look at the capability of the device.
Media queries can be used to check many things, such as:
width and height of the viewport
width and height of the device
orientation (is the tablet/phone in landscape or portrait mode?) resolution
Using media queries are a popular technique for delivering a tailored style sheet to tablets, iPhone, and Androids.
References:
https://www.asp.net/whitepapers/add-mobile-pages-to-your-aspnet-web-forms-mvc-application http://www.w3schools.com/css/css3_mediaqueries.asp

by rhysabray at March 25, 2020, 3:03 p.m.

Comments

Submit Cancel

Imen_chaaben

4 years, 5 months ago

I think it's correct: B & D https://www.templatemonster.com/blog/css-media-queries-for-all-devices-and-browsers-including-ie7-and-ie8/

upvoted 1 times

...

zozox

4 years, 10 months ago

The application must render properly in Internet Explorer 8 or later versions. - OR LATER VERSIONS. Answer is correct B & D

upvoted 3 times

...

mr_

5 years ago

That is really weird question... * What does it actually mean correctly here? 'Content must display correctly when a device is in landscape or portrait orientation.' * If content should not be scalable, then using percentages for CSS width and height does not make any sense. Percentages are meant to be used when auto-scaling of the elements are expected. I doubt C is correct then. 'Content must not scale when the device orientation changes.' * On the other hand it is expected that content should fulfill maximum available screen space. Then it has to be set to 100% somewhere. So in that case I had a feeling that B & D may be correct answers here but... * Media queries are supported from IE9. The requirements states that IE8 has to be supported so D does not sound like the correct answer here.

upvoted 1 times

mr_

5 years ago

Sorry - I might have misunderstood the C answer. It is not about site elements but only about setting the width and height of the 'html' element.

upvoted 1 times

...

hungry_ape9000

5 years, 1 month ago

FINAL ANSWER: B & C B for the viewport meta tag C for setting height/width on elements to 100% to take up maximum available screen space as it says, and to accommodate IE8 since media queries are not supported.

upvoted 4 times

...

lifetocode

5 years, 2 months ago

So what are the correct answers?

upvoted 1 times

...

rhysabray

5 years, 3 months ago

According to caniuse.com IE8 does not support media queries.. all later versions do however.. Source: https://caniuse.com/#feat=css-mediaqueries

upvoted 2 times

Dev666

5 years, 1 month ago

Must be C And D as innerWidth and innerHeight is only supported by IE9 and later also .

upvoted 1 times

...

zimzimzimma

5 years, 1 month ago

Good catch on the IE8 thing. But according to https://www.lead4pass.com/online-pdf/70-486.pdf it should be still B and D :/ So yeah, if one would choose B and C as the answer and it would be counted wrong, you would have ammunition to challenge that answer.

upvoted 1 times

...