html - CSS - How do you make text overflow out both ends of a div? -

मेरे पास यह div (एक लाल वृत्त) है:

जो था इस सीएसएस के साथ बनाया:

  .marker-cluster-div {width: 30px; ऊंचाई: 30px; फ़ॉन्ट-आकार: 12px; सीमा-त्रिज्या: 50%; कला रंग; फोंट की मोटाई: बोल्ड; पाठ संरेखित करें: केंद्र; ऊर्ध्वाधर-पंक्ति: बीच; रेखा-ऊंचाई: 30px; }  

मैं div के दोनों छोरों से समान रूप से div प्रवाह में पाठ कैसे बना सकता हूँ? मैं चाहता हूं कि पाठ को डिवि के बाईं ओर थोड़ा प्रारंभ करना चाहिए और यदि इसे फिट नहीं आता तो इसके ठीक नीचे दायें यदि पाठ ठीक हो जाता है, तो उसे केंद्र में रखें

मैं सीएसएस में यह कैसे करूँ?

जैसा कि मैंने अपनी टिप्पणी में बताया , आपको वास्तव में से '' युक्त '' डिवि से बाहर बहना नहीं होना चाहिए।

मैं ऐसा कुछ सुझाव दूंगा।

HTML

<पूर्व> & lt; div class = "circle" & gt; & Lt; div class = "text" & gt; & Lt; p & gt; वेबसाइट पर जाएं। & Lt; / p & gt; & Lt; / div & gt; & Lt; / div & gt;

सीएसएस

  .circle {margin: 50px; चौड़ाई: 50px; ऊँचाई: 50px; बॉर्डर-त्रिज्या: 50%; स्थिति: रिश्तेदार; पृष्ठभूमि: लाल; } .circle .text {स्थिति: पूर्ण; शीर्ष: 50%; बाएं: 50%; रूपांतरण: अनुवाद (-50%, -50%); चौड़ाई: ऑटो; white-space: nowrap; }  

या ... बेहतर -

HTML

  & lt; div class = "circle "& gt; & Lt; p & gt; वेबसाइट पर जाएं। & Lt; / p & gt; & Lt; / div & gt;  

सीएसएस

  .circle {स्थिति: रिश्तेदार; प्रदर्शन: इनलाइन-ब्लॉक; }। Cycle: after {content: ""; स्थिति: पूर्ण; शीर्ष: 50%; बाएं: 50%; रूपांतरण: अनुवाद (-50%, -50%); चौड़ाई: ऑटो; चौड़ाई: 50px; ऊँचाई: 50px; बॉर्डर-त्रिज्या: 50%; पृष्ठभूमि: लाल; z- सूचकांक: -1; }