Is is possible to write css mediaquery based on control width instead of viewport width.
Example: If container min-width > 1000px set color=red and else set color=red using css ? OR Instead of mediaquery, Is there any other way to achieve this scenerio ?
CSS is not the proper tool for this job. It is not a scripting language and has very little functional use of conditionals. And that good! That's how it is supposed to be. Luckily we have JavaScript. JS makes it easy. jsfiddle
<div style="width: 1000px" id="content">
<h2>some title here</h2>
<p>some content here</p>
</div>
<script>
var div = document.getElementById('content');
var el = div.style.width;
document.write ("SomeText");
if(el === '1000px')
{
document.body.style.backgroundColor="red";
}
else
{
document.body.style.backgroundColor="blue";
}
</script>
Keep in mind that this will break your style if a user has JavaScript turned off. Not a big deal but worth remembering.
