सीएसएस

Question

के साथ इनलाइन ब्लॉक और टेक्स्ट रैपिंग मैं एक चेकबॉक्स प्रदर्शित करना चाहता हूं, उसके बाद कुछ पाठ जो उसके नीचे चारों ओर लपेटता है। किसी भी सीएसएस के बिना HTML के रूप में निम्नानुसार है:

X Long Text 
    Description 
    Here 

यह वर्तमान में इस

X Long Text 
Description Here 

इस के साथ क्या करने के लिए आसान है की तरह इर्द-गिर्द घूमती:

<input type="checkbox" checked="checked" /> 
<div>Long text description here</div> 

मैं इसे करने के लिए इसी प्रदर्शित करना चाहते हैं टेबल, लेकिन मुझे अन्य कारणों से सीएसएस में होना चाहिए। मैंने डिस्प्ले का संयोजन सोचा: इनलाइन-ब्लॉक/फ्लोट: डीआईवी के बजाए दाएं/स्पष्ट/स्पैन काम करेंगे, लेकिन अब तक मुझे कोई भाग्य नहीं मिला है। कितनी जगह को

input { float: left; } 
div { margin-left: 40px; } 

ट्यून margin-left: -

Answer 1

लपेटें चेकबॉक्स और लेबल एक कंटेनर div में (या ली मैं सूचियों अक्सर साथ रूपों करते हैं) और लागू

<div class="checkbox"> 
    <input type="checkbox" id="agree" /> 
    <label for="agree">I agree with checkbox</label> 
</div> 




.checkbox input { 
     float:left; 
     display:block; 
     margin:3px 3px 0 0; 
     padding:0; 
     width:13px; 
     height:13px; 
    } 

.checkbox label { 
     float:left; 
     display:block; 
     width:auto; 
    } 

Answer 2

इस प्रयास करें तुम्हें चाहिए। चेकबॉक्स पर float: left मूल रूप से ब्लॉक लेआउट से बाहर ले जाता है, इसलिए यह टेक्स्ट को धक्का नहीं देता है।