css - How to middle vertical align a radio button against an image in html? -

मेरे पास 100x100 की एकाधिक छवि है।

यह कोड है:

  & lt; div & gt; & Lt; इनपुट प्रकार = "रेडियो" नाम = "तस्वीर" मान = "1" /> gt; & lt; img src = "pic01.jpg" / & gt; & lt; br / & gt; & Lt; इनपुट प्रकार = "रेडियो" नाम = "तस्वीर" मान = "2" /> gt; & lt; img src = "pic02.jpg" / & gt; & lt; br / & gt; ....  

और इतने पर ... लेकिन समस्या यह है कि रेडियो बटन लाइन के निचले भाग में रेंडर करता है और मैं इसे छवि के ऊर्ध्वाधर बीच में आना चाहता हूं । style = "vertical-align: middle" और यह काम नहीं करता है।

कोई भी विचार?

इनलाइन तत्वों पर लागू होने पर, निर्दिष्ट करता है कि मूल तत्व के एक निश्चित हिस्से को माता-पिता के लाइन बॉक्स के संबंधित हिस्से में कहाँ संरेखित करें। उदाहरण के लिए, "मध्यम" लगभग प्रत्येक के मध्य भागों को संरेखित करता है यदि आप दो भाई-बहनों को संरेखित करना चाहते हैं, तो आपको दोनों के लिए एक ही ऊर्ध्वाधर संरेखण को लागू करना होगा, अन्यथा तत्व मूल आधार रेखा से संरेखित होगा।

  & lt; शैली प्रकार = "पाठ / सीएसएस "& gt; इनपुट [प्रकार = "रेडियो"], इनपुट [प्रकार = "रेडियो"] + लेबल img {vertical-align: middle; } & Lt; / style & gt; & LT; ul & gt; & Lt; li & gt; & Lt; input type = "radio" name = "pic" id = "pic1" मान = "1" / & gt; & Lt; label for = "pic1" & gt; & lt; img src = "pic1.jpg" alt = "pic 1" / & gt; & lt; / लेबल & gt; & Lt; / li & gt; & Lt; li & gt; & Lt; input type = "radio" name = "pic" id = "pic2" मान = "2" / & gt; & Lt; label for = "pic2" & gt; & lt; img src = "pic2.jpg" alt = "pic 2" /> gt; & lt; / लेबल & gt; & Lt; / li & gt; & Lt; / ul & gt;