# \[Pro\] media query

**URL:** <https://discourse.softpress.com/t/pro-media-query/15708>\
**Category:** Freeway\
**Created:** [November 24, 2012, 2:47am UTC](https://discourse.softpress.com/t/pro-media-query/15708 "2012-11-24T02:47:11Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Justin\_Easthall](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/j/2acd7d/32.png) [@Justin\_Easthall](https://discourse.softpress.com/u/Justin_Easthall)\
**Post date:** [November 24, 2012, 2:47am UTC](https://discourse.softpress.com/t/pro-media-query/15708/1 "2012-11-24T02:47:11Z")

</div>

Im trying to make the ‘red deal’ callout disappear after a certain width is hit (500px) - I stuck this in before the /head in the HTML markup…

@media screen and (max-width: 500px) { .deal { display: none; }

Not working - Anyone know whats wrong?

Cheers

> **[Website Design Company | South Florida | Easthall Design](https://www.easthalldesign.com)**
>
> Boost Visibility, Drive Engagement & Improve ROI for your Business Website. South Florida's Award Winning Web Design Company.

* * *

freewaytalk mailing list  
email@hidden  
Update your subscriptions at:  
[http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

---

<div class="post-metadata">

**Author:** ![Ernie\_Simpson](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/e/a587f6/32.png) [@Ernie\_Simpson](https://discourse.softpress.com/u/Ernie_Simpson)\
**Post date:** [November 24, 2012, 8:05am UTC](https://discourse.softpress.com/t/pro-media-query/15708/2 "2012-11-24T08:05:00Z")

</div>

Two things are working against you. Your @media statement is missing a  
closing curly bracket (whatever “{ }” are called) and your style is using a  
class identifier instead of an id (“.” instead of “#”).

In all, the media query should read:

@media screen and (max-width: 480px) {  
#deal { display: none; }  
}

Otherwise, well done.

–  
Ernie Simpson

On Fri, Nov 23, 2012 at 9:47 PM, Justin Easthall [email@hidden](mailto:email@hidden) wrote:

> Im trying to make the ‘red deal’ callout disappear after a certain width  
> is hit (500px) - I stuck this in before the /head in the HTML markup…
> 
> @media screen and (max-width: 500px) { .deal { display: none; }
> 
> Not working - Anyone know whats wrong?
> 
> Cheers
> 
> [http://www.easthalldesign.com](http://www.easthalldesign.com)
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

freewaytalk mailing list  
email@hidden  
Update your subscriptions at:  
[http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

---

<div class="post-metadata">

**Author:** ![Justin\_Easthall](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/j/2acd7d/32.png) [@Justin\_Easthall](https://discourse.softpress.com/u/Justin_Easthall)\
**Post date:** [November 24, 2012, 1:32pm UTC](https://discourse.softpress.com/t/pro-media-query/15708/3 "2012-11-24T13:32:11Z")

</div>

AWSOME! Thanks

* * *

freewaytalk mailing list  
email@hidden  
Update your subscriptions at:  
[http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)