पूरे div को क्लिक करने योग्य कैसे करें

Question

मैं एक मेनू बना रहा हूं और एक सरल और बेवकूफ मुद्दा है। समस्या यह है: मेरे पास 'मेनू' div के अंदर मेरे <span> तत्व हैं। आईडी '#menu' के साथ। मैंने एक फीचर बनाया है जिसके द्वारा आप पर <span> के अंदर सीएसएस visibility के माध्यम से गलती से क्लिक नहीं कर सकते हैं। लेकिन अब यदि आप सफेद धारियों के बीच अंतरिक्ष में मेनू पर क्लिक करते हैं, तो यह एक बटन की तरह कार्य नहीं करेगा।

तो सवाल यह है: 'यह <div> कैसे पूरी तरह क्लिक करने योग्य है?'

Here's the Fiddle.

अग्रिम धन्यवाद।

Answer 1

यह बस width संपत्ति के साथ क्या किया जा सकता है, बस मेनू div करने के लिए एक चौड़ाई जोड़ने की जरूरत:

#menu { 
    -moz-user-select: none; 
    height: 40px; 
    margin: 50px; 
    position: absolute; 
    width: 40px; /* newly added */ 
} 

Answer 2

इसके बजाय निश्चित चौड़ाई रखने का, हम भी चौड़ाई 100% जो आप अधिक देता है का उपयोग कर सकते मेनू को संकुचित करने के लिए क्लिक करने योग्य क्षेत्र

#menu { 
    position: absolute; 
    height: 40px; 
    width : 100%; /*newly added*/ 
    margin: 50px; 
    -webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none 
}