HTML/CSS व्हाइटस्पेस तोड़ने

Question

मैं

http://jsfiddle.net/rkEpx/

तरह मार्कअप के साथ क्यों सोच रहा हूँ मैं

मिल आप देख सकते हैं, 1 और पिछले मेनू आइटम अपने लिंक हड्डी टूट गई है 3 लाइनों में भी विस्तार करने के लिए पर्याप्त जगह है। क्या लाइन को तोड़ना संभव नहीं है जब तक कि वास्तव में कोई जगह न हो? यदि कोई निश्चित चौड़ाई निर्धारित करने या गैर-ब्रेकिंग रिक्त स्थान का उपयोग किए बिना संभव हो?

Answer 1

  एचटीएमएल इकाई या white-space: nowrap; सीएसएस। लेकिन वास्तव में कोई जगह नहीं होने पर भी यह तोड़ नहीं जाएगी। अपने li, img और/या p

आप के लिए display: inline-block;float: left; के बजाय का उपयोग कर प्रयास कर सकते हैं।

http://jsfiddle.net/2Mv2E/

Answer 2

कोशिश जोड़ने:

li { 
    padding: 0; 
    margin: 0 3px 0 0; 
    float: left; 
    max-width: 120px; 
white-space: nowrap; 
} 

Answer 3

मुझे पता नहीं क्यों ऐसा बर्ताव कर रही है है, लेकिन यह आप चल उसे ठीक कर सकते लगता है p के रूप में अच्छी तरह:

p { 
    float: left; 
} 

अपनी ब्राउज़र आवश्यकताओं के आधार पर, आप छवि के ठीक बाद p को भी फ़्लोट करना चुन सकते हैं:

img + p { 
    float: left; 
}