परिवर्तनीय-ऊंचाई तत्व पर पूरी तरह से परिपत्र कॉर्नर बनाए रखें

मेरे पास पूरी तरह गोलाकार कोनों वाला बटन है; मतलब, बटन 50px ऊंचा है और सीमा त्रिज्या 25px है, जो बटन के दोनों तरफ एक पूर्ण अर्ध-सर्कल बनाता है:

यहां छवि विवरण दर्ज करें

सीएसएस के साथ इसे हासिल करना आसान है, बशर्ते आप पहले से ही बटन की ऊंचाई (बटन ऊंचाई ÷ 2 = सीमा त्रिज्या) जानते हों।

लेकिन क्या बटन की ऊंचाई गतिशील रूप से बढ़ जाती है (उदाहरण के लिए, अधिक पाठ जोड़ा जाता है), पूरी तरह से परिपत्र किनारों को बनाए रखना संभव है ?:

यहां छवि विवरण दर्ज करें

0

1 उत्तर

360px जैसे कुछ उच्च पर बस सीमा-त्रिज्या सेट करें।

div {
    height:50px;
    width:500px;
    background:red;
    border-radius:360px;
}

मेरा मतलब क्या है यह देखने के लिए यह jsFiddle उदाहरण देखें।

0
जोड़ा