floating problems

To add to the above, I created a small html document with the same markup, css and images and it actually works, so it seems like there is something in the wordpress css that is preventing the floating to work correctly…

First of all, create a child theme, don’t be adding stuff to a parent theme as when you update the theme or WordPress then your code will disappear.

I think you should do this first.

Take out the <br /> tag after the first image and it will work.

hi thanks. Sorry I am very new to this so I am not sure what you mean by not adding stuff to a parent theme and use a child one. I mean, happy to do that, but how do I do?

ALso about the cose, you’re right there seems to be a stray br tag, but unfortunately it is not in the code I have written. Literally, this is what I have written:

<p>Content goes here.</p>
<div class = "social_media">
   <img src = "https://andys.antonioborrillo.co.uk/wp/wp-content/themes/twentyeleven/images/FaceBook_48x48.png" alt = "" id = "facebook_image">
   <img src = "https://andys.antonioborrillo.co.uk/wp/wp-content/themes/twentyeleven/images/Twitter_48x48.png" alt = "" id = "twitter_image">
</div><!-- end of social_media -->

without the br tag and unfortunately there is no way I can remove it if it isn’t there!

If you view the source code you can see a
tag after the first image and it is this that is causing the problem. Have a look on the page in your WordPress dashboard and switch to html view.

Here is a tutorial about Child Themes and how to create one.

If you get stuck then add a new topic in the forum.

HI thanks. About the extra br yes, I can see it in the source code but only in firebug. On my page instead – I mean in wordpress I am already working on the html view, and the br isn’t there for whatever reason. This is what I was saying before, I can’t get rid of it if I don’t see it in the code. ANy advice?
I will look at the child theme thingy thanks

cjc1867, thanks for your help, I resolved by switching to “visual” mode and hit the back button so that the images lined up on the same line. Oddly enough, in the HTML view there was absolutely no br tag (although we both know that the source code was showing it). Very odd. COuld it be because I am using html and not xhtml?

The visual editor adds tags and removes them as well just got to watch what you are doing. You can add the social media icons via plugins and this might solve the problem but it depends on how you want your theme to look.

Have a look at a Child Theme, something new you have learnt today.
Have a look at a plugin for Social Media.

cjc1867, thanks. I had created a child theme as you suggested, now I know what you mean.
As for the social media, it seems to work now, I had a very brief look at the social media plug in, but I think I will stick to my icons. It’s just the thought of that br tag that is still bugging me …

ah cjc1867, I have one more question about the child theme. I have followed the instructions in your link, but something occurred to me. Take this example: the text in the header here https://andys.antonioborrillo.co.uk/wp/?page_id=24, it has a funny colour. Now, I would like to change it but if I change it onto the new css file, the old one that is imported @import url("../twentyeleven/style.css"); means that the old style will override the new one…correct?

No, not necessarily. CSS works top down, and the child styles are interpreted AFTER the parent styles — so they will take precedence UNLESS the parent styles are more specific. In that case, you need to make the child styles equally or more specific and then there is no problem at all.

In the page you mention, if you mean the site title, you would change the color by adding this to the child style.css:

#site-title {
   color: #XXXXXX;
}

Ok perfect done, thanks