सास नकारात्मक चर मान?

Question

मेरे पास scss चयनकर्ताओं की एक जोड़ी है जहां मैं उसी राशि का सकारात्मक और नकारात्मक उपयोग करता हूं, जैसे:

padding: 0 15px 15px;
margin: 0 -15px 20px -15px;

मैं सभी 15px राशियों के लिए एक चर का उपयोग करना चाहता हूँ, लेकिन यह काम नहीं करता है:

$pad: 15px;
padding: 0 $pad $pad;
margin: 0 -$pad 20px -$pad;

मार्जिन राशियां सकारात्मक संख्या में बदल जाती हैं। क्या मैं कुछ भूल रहा हूँ?

Answer 1

इसे ऐसे ही आजमाएं

margin: 0 (-$pad) 20px (-$pad);

Comments

स्वचालित रूप से इस दृष्टिकोण की कोशिश की - लगता है जब कैल्क फ़ंक्शन का उपयोग कर काम नहीं किया जा रहा है। संपादित करें: लगता है जैसे आपको कैल्क का उपयोग करते समय कोष्ठक का उपयोग करने की आवश्यकता नहीं है, लेकिन आपको stackoverflow.com/questions/17982111/…

— केविन

Answer 2

Sass दिशा निर्देशों के अनुसार एक और अधिक समझदार समाधान interpolateनिम्न उदाहरण की तरह चर के लिए होगा:

margin: 0 -#{$pad} 20px -#{$pad};

एक उदाहरण: https://www.sassmeister.com/gist/c9c0208ada0eb1fdd63ae47830917293

Comments

@Green आप हमेशा उदाहरण लिंक की जाँच कर सकते हैं: sassmeister.com/gist/c9c0208ada0eb1fdd63ae47830917293

— Vangel Tzo

Answer 3

मैं पिछले दो जवाबों पर विचार करने के बाद अपना दो-पन्ना जोड़ रहा हूं, लेकिन फिर इसे पढ़ना (मेरा जोर देना):

आपको विशेष रूप से प्रक्षेप जैसे प्रयोग से बचना#{$number}px चाहिए । यह वास्तव में एक नंबर नहीं बनाता है! यह एक निर्विवाद स्ट्रिंग बनाता है जो एक संख्या की तरह दिखता है, लेकिन किसी भी संख्या के संचालन या कार्यों के साथ काम नहीं करेगा। अपनी गणित इकाई को साफ-सुथरा बनाने की कोशिश करें ताकि $numberपहले से ही इकाई हो px, या लिखें $number * 1px।

स्रोत

इसलिए मेरा मानना ​​है कि सही तरीका इस प्रकार होगा, जो SASS / SCSS की गणितीय क्षमताओं को संरक्षित करता है:

$pad: 15px;
padding: 0 $pad $pad;
margin: 0 $pad*-1 20px $pad*-1;

Comments

पहली नज़र में, यह नाइट-पिकिंग (आपका उत्तर) लगता है, लेकिन दूसरी नज़र में यह वास्तव में बेहतर जवाब है। सब के बाद, यदि चर एक नकारात्मक चर बन जाता है तो उत्तर सकारात्मक हो जाता है! $ पैड: -2rem; ... मार्जिन: 0 - # {$ पैड}; // मार्जिन हो जाता है: 0 - 2rem; मार्जिन: 0 $ पैड * -1; // मार्जिन हो जाता है: 0 2rem;

— फॉनॉर्डियस