css not working in chrome emulator
Hi
can anyone tell me why this code is not working in chrome emulator
Red border and padding are not getting applied on firstcol and secondcol in chrome emulator.
Code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css" media="screen">
@media screen and (max-width:480px){
.firstcol{width:90%; border:1px solid #ff0000; padding:10px; font-size:2em}
.secondcol{width:90%; border:1px solid #ff0000; padding:10px; font-size:2em}
}
@media screen and (min-width:600px) and (max-width:800px){
.firstcol{width:42%; float:left; border:1px solid #ff0000; padding:10px; font-size:2em}
.secondcol{width:42%; float:left; border:1px solid #ff0000; padding:10px; font-size:2em}
}
</style>
</head>
<body>
<div class="firstcol">This is the first column</div>
<div class="secondcol">This is second column</div>
</body>
</html>
Thanks
Vineet