hariskar Posted December 4, 2016 Share Posted December 4, 2016 In my webpage I would like to put an image in the text logo I have now. I would like the image to be in the right of mikroviologos.gr. Now the code is: <div id="logoArea" class="col-3" title="Μικροβιολογικό Εργαστήριο στην Καβάλα"><h1><a href=/><div id="l1">mikroviologos.gr</div><div id="l2">Εργαστήριο Μικροβιολογίας</div></a></h1></div> If I change it to <div id="logoArea" class="col-3" title="Μικροβιολογικό Εργαστήριο στην Καβάλα"><h1><a href=/><div id="l1">mikroviologos.gr<img src="image.png"></div><div id="l2">Εργαστήριο Μικροβιολογίας</div></a></h1></div> and try to apply some margin-top the whole logo moves. How can I make only the picture move? I want to align it to the text. Thank you! Link to comment Share on other sites More sharing options...
WoHe Posted February 6, 2017 Share Posted February 6, 2017 You could maybe try to float:right the image. I'm also new , but I had a similar problem and it worked when I used this float:right. 1 Link to comment Share on other sites More sharing options...
dsonesuk Posted February 7, 2017 Share Posted February 7, 2017 (edited) You shouldn't use div block elements within h1 block element, since img by default is inline, instead of div, use span which is also inline, they should act as text and align side by side. IF width or height is required give these elements display: inline-block;. Using div block elements mean they will break to a new line, and the same for every block element following it, unless there is available width and float is used, but! As already mentioned block element within block header element is not allowed. Edited February 7, 2017 by dsonesuk 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now