I tried aligning my image next(right side) to my heading . With the following code. The following html code for element:
/* And Tried to Align using css */
#colorlib-logo img {
display: flex;
align-items: center;
width: 30px;
height: 30px;
}
#colorlib-logo h1 {
margin-right: 3px;
margin-left: 0px;
}
#colorlib-logo {
width: 300px;
}
<h1 id="colorlib-logo"><a href="">HaamTheLord</a><img src="" alt="logo" /></h1>
This Code Displays the image below the heading .But I Want The Image To be Displayed To right of the text
You're applying display: flex property incorrectly.
I have made some changes to your code, please check: