css - Display image and text in same line -
I want to display the image and the text in a line such as tripadvisor.in /
& Lt; Div style = "display: inline-block" & gt; & Lt; Div style = "display: inline; float: left" & gt; & Lt; A href = "CollegeProfile.php" class = "white" & gt; & Lt; H4 style = "margin-down: 10px; display: inline" & gt; Good college to study & lt; / H4 & gt; & Lt; / A & gt; & Lt; Br / & gt; & Lt; A href = "CollegeProfile.php" class = "white" & gt; Indian Institute of Management, Ahmedabad and LT; / A & gt; Read the review. & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div style = "display: inline-block" & gt; & Amp; Nbsp; & Lt; Img class = "shakeImage" src = "assets / img / author.jpg" style = "border: 1px solid white; height: 60px; display: inline" /> & Lt; / Div & gt;
This image and text shows in a different line such as:
If you have to stop using the div
elements , You can do this with the following:
HTML
& lt; Div class = 'table' & gt; & Lt; Div class = 'cell' & gt; & Lt; A href = "CollegeProfile.php" & gt; & Lt; H4 & gt; Good college to study & lt; / H4 & gt; & Lt; / A & gt; & Lt; A href = "CollegeProfile.php" & gt; Indian Institute of Management, Ahmedabad and Lieutenant; A / A & gt; Read the review. & Lt; / Div & gt; & Lt; Div class = 'cell' & gt; & Lt; Img class = "shakeImage" src = "assets / img / author.jpg" style = "border: 1px solid white; height: 60px; display: inline" /> & Lt; / Div & gt; & Lt; / Div & gt;
css
.table {display: table; } .cell {display: table-cell; Vertical-align: medium; } H4 {margin: 0; }
Comments
Post a Comment