मुझे आपकी मदद चाहिए। मेरे पास प्रोफाइल पेज है, मैंने बहुत सी वेबसाइटों पर शोध किया है, लेकिन मुझे नहीं मिला, क्या आप मेरी मदद कर सकते हैं? मुझे सभी वस्तुओं को केन्द्रित करने की आवश्यकता है, और मेरी छवि एंजेला यू (शीर्ष की छवि, आप देख सकते हैं) की तरह होनी चाहिए। कृपया सहायता कीजिए

 <div className="asd">
    <img alt="123" src={asd}></img>
      <div className="top-container">
        <div></div>
        <div className="user-profile-img">
          <img alt="profileImg" src={user.photoURL}></img>
        </div>
      </div>
      <div className="middle-container">
        <p>Your email: example@gmail.com</p>
        <p>Your user id: 123213213213</p>
        <p>Your display name: ASDSADASDSA</p>
      </div>
    </div>

enter image description here

1
coldasspirit 6 जुलाई 2021, 12:59

3 जवाब

सबसे बढ़िया उत्तर

बस उन कक्षाओं में text-align:center जोड़ें, जिन्हें आप टेक्स्ट के बीच में रखना चाहते हैं। यहां आप देख सकते हैं कि किसी छवि को कैसे केंद्र में रखा जाए। बस गूगल।

0
Sowam 6 जुलाई 2021, 10:33

मेरा सुझाव है कि फ्लेक्सबॉक्स का उपयोग करें।

आप जिस सामग्री को केंद्र में रखना चाहते हैं, उसे div में लपेट सकते हैं, और उस पर इस CSS को लागू कर सकते हैं:

display:flex;
justify-content:center;

फ्लेक्सबॉक्स सीखने के लिए यहां एक शानदार वेबसाइट है।

0
nico263nico 6 जुलाई 2021, 10:40
  1. एक सामान्य वर्ग .textCenter{text-align:center} बनाने का प्रयास करें और प्रत्येक माता-पिता <div> उदाहरण <div className="middle-container textCenter"> में इसका उपयोग करें, इसमें सभी बच्चे तत्व उस <div> के केंद्र में संरेखित होंगे।

  2. यदि आप उपरोक्त नमूना छवि में दिखाए गए अनुसार 2 पंक्तियों में नाम चाहते हैं तो आपको नाम टैग उदाहरण को अधिकतम-चौड़ाई देने की आवश्यकता है: max-width:'50px'

0
Latha Nithin 6 जुलाई 2021, 10:55