Is it possible to do Media Queries using Sass?

http://reference.sitepoint.com/css/mediaqueries
http://www.w3.org/TR/css3-mediaqueries/

With the advent of iPhone and iPad, they're becoming increasingly
useful. For an example in the wild, have a look at this:

http://workshopsfortheweb.com/

Narrow your browser window to see the design dynamically change based
on the size of the viewport. The CSS that does that looks like this:

  @media all and (max-width: 1024px) {
    .content {
      width: 85%;
    }
  }

  @media all and (max-width: 800px) {
    .content {
      width: auto;
    }
    .next .vevent {
      padding-left: 0;
      padding-right: 0;
    }
    section ul,
    header.vevent hgroup,
    header.vevent li,
    #contact textarea,
    #contact fieldset,
    .home .workshops section,
    .home .workshops section.ux {
      width: 99%;
      clear: both;
      float: none;
      padding-left: 0;
      padding-right: 0;
      margin-left: 0;
      margin-right: 0;
    }
  }
  @media all and (max-width: 640px) {
    .site h1 {
      font-size: 3em;
    }
  }
  @media all and (max-width: 480px) {
    .site h1 {
      font-size: 2em;
    }
  }

-- 
You received this message because you are subscribed to the Google Groups 
"Haml" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to [email protected].
For more options, visit this group at http://groups.google.com/group/haml?hl=en.

Reply via email to