html – CSS move Icon to right-ThrowExceptions

Exception or error:

I created a UI with a Icon, User Name and Phone number below. The CSS properties I used for Image are

float: left;
position: relative;
margin-left: 4%;

enter image description here

When i increase margin-left the image and usrname both are moving to right side. I just want to move the icon to right a little bit. How Can Do That ?

How to solve:

It’s a bit hard to give you a specific answer without the exact Markup and the context in which you’re writing your CSS. However, I would suggest following the Markup and Styles that are written in most newer CSS Frameworks like Bootstrap and Font Awesome. They both use span or i elements to attach the icons to, so your HTML is semantically valid. Also, this will give you more flexibility to apply your specific icons styles.

Inspecting the i element in the Font Awesome example should give you a good idea of some base icon styles and should allow you to get the desired look.

Leave a Reply

Your email address will not be published. Required fields are marked *