div element is block element and default display property is block , to display it in line , inline-block property can be used.
(div元素是block元素，默认显示属性是block，要在line中显示它，可以使用inline-block属性。)
<!DOCTYPE html> <html> <head> <title>Pictures</title> <style type="text/css"> .row { height: 50px; width: 50px; } .row1 { padding-bottom: 12px; display: inline-block; float: left; padding-right: 14px; } .row2 { display: inline-block; } } #img1 { max-width: 50%; max-height: 20%; } </style> <script type="text/javascript"> </script> </head> <body> <div class="content"> <div class="row"> <div class="row1"> <!--img height="50px" width="50px" src="images/image1.jpg"--> hello </div> <div class="row2"> Beutiful picture clicked by photographer </div> </div> </div> </body> </html>
I don't understand why these 2 divs are not getting display side by side , i am using inline-block but still no help.
(我不明白为什么这2个div无法并排显示，我使用的是内联块，但仍然没有帮助。)
ask by Rakesh Bagaria translate from so 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
