+ 1

why margin-bottom or padding bottom doesn't work?

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> a { display: inline-block; } img { width: 50px; display: inline-block; } span { display: inline-block; margin-bottom: 20px; padding-bottom: 20px; } </style> </head> <body> <a href=""> <img src="https://www.logologo.com/logos/tree-logo.jpg" alt="Logo"> <span>My Website</span> </a> </body> </html>

11th Mar 2020, 6:20 AM
Faruk All Hossain
Faruk All Hossain - avatar
4 Answers
+ 3
// It's working but not visible because background color is white, Give background color to span and you can see https://code.sololearn.com/W12nywuAZJod/?ref=app //Note: i will delete this private code is 24h please copy if you want
11th Mar 2020, 6:34 AM
Sudarshan Rai
Sudarshan Rai - avatar
+ 1
Set vertical-align: bottom; on span tag
11th Mar 2020, 6:35 AM
CalviŐ˛ - avatar
Sudarshan Rai đź‘‘ yeah i know it works. but why i can't put it up with margin or padding bottom?
11th Mar 2020, 8:04 AM
Faruk All Hossain
Faruk All Hossain - avatar
margin-top and margin-bottom doesn't work on non-replaced elements like <span>
28th Jan 2023, 9:21 AM
dumchik - avatar