Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Variables not work in @media #1975

Closed
teratron opened this issue Apr 15, 2014 · 5 comments
Closed

Variables not work in @media #1975

teratron opened this issue Apr 15, 2014 · 5 comments
Labels
consider closing needs info

Comments

@teratron
Copy link

check plz

@media only screen and (min-width: @layout_width) {
    .inner {
        width: @layout_width;
    }   
}

@media only screen and (min-width: @mobile_width) and (max-width: @layout_width) {
    .inner {
        width: 100%;
    }   
}

thx!
@teratron teratron changed the title Variables not work on @media Variables not work in @media Apr 15, 2014
@jonschlinkert
Copy link
Contributor

please use backticks to wrap your code. someone with the username @media just got a notification.

@teratron
Copy link
Author

i can )
sorry

@robinpokorny
Copy link

I tried it and was not able to reproduce any error (using v1.7.0). But there, what is the problem supposed to be? Could you be more specific?

There may be an issue with variable Interpolation, please check it out.

@teratron
Copy link
Author

code for test - normal work!
i have a problem in my code )

<head>
<meta charset="utf-8" />
<title>Test</title>
<style type="text/less">
html, body {
height: 100%;
}
body {
margin: 0; width: 100%;
}
.main {
background-color: green;
min-height: 500px;
margin: 0 auto;
}

@layout_width: 960px;
@mobile_width: 500px;

@media only screen and (min-width: @layout_width) {
.main {
background-color: #aaa;
width: @layout_width;
}   
}
@media only screen and (min-width: @mobile_width) and (max-width: @layout_width) {
.main {
background-color: red;
width: 100%;
}   
}
</style>
<script src="less.js"></script>
</head>
<body>
<div class="main">
</div>
</body>

@robinpokorny
Copy link

Tried the file with freshly downloaded less#v1.7.0 from the docs - and it is working. The colours are changing.

Are you sure you are using the current version of less? Is it properly linked?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
consider closing needs info
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@robinpokorny @lukeapage @jonschlinkert @teratron @seven-phases-max