CSS फ्लोट गुणों का उपयोग करके, आप किसी भी टेक्स्ट के दाईं ओर किसी भी छवि को फ्लोट कर सकते हैं, जैसा कि इस पाठ के दाईं ओर छवि के साथ देखा जा सकता है। अपने वेब पेज पर ऐसा करने के लिए नीचे दिए गए चरणों का पालन करें।

इस उदाहरण में, हम एक बाहरी CSS फ़ाइल का उपयोग करेंगे। बाहरी CSS फ़ाइल का उपयोग करके, आप किसी भी पृष्ठ पर एक अस्थायी छवि बना सकते हैं जिसमें CSS फ़ाइल का लिंक शामिल है। बाहरी सीएसएस फ़ाइलें भी भविष्य में समायोजित करने के लिए अपनी इच्छित किसी भी सेटिंग्स को बदलना आसान बना देती हैं।

1. एक सीएसएस फ़ाइल बनाएँ। यदि आपके पास अपने वेब पेज के लिए पहले से ही CSS फ़ाइल है, तो अपनी CSS फ़ाइल को संपादित करें और निम्न कोड जोड़ें।

2. सीएसएस फ़ाइल में निम्न कोड जोड़ें।

 .floatRight {फ्लोट: सही; margin-left: 20px} 

टिप: फ्लोट जोड़ना: बाईं ओर छवि को टेक्स्ट के बाईं ओर फ्लोट करना होगा।

यदि आप दाईं ओर एक से अधिक छवि फ्लोटिंग करना चाहते हैं, तो CSS फ़ाइल में निम्न पंक्ति भी जोड़ें।

 .floatRightClear {फ्लोट: ठीक है, स्पष्ट: ठीक है, margin-left: 20px} 

3. उपरोक्त कोड बनने के बाद, CSS फ़ाइल को सेव करें और नीचे दिए गए उदाहरण के समान कोड का उपयोग करके प्रत्येक HTML पेज से कॉल करें। हमारे उदाहरण में, हमने CSS फ़ाइल style.css का नाम दिया है।

4. अंत में, किसी भी छवि में जोड़ें जिसे आप कंटेनर के दाईं ओर तैरना चाहते हैं।