Putting icons side by side

I want to put these two icons side by side (Facebook and Twitter)

How would I do that, current code i have is this and right now they are on top of each other...

<div class="widget-text">
                                            <a href="https://www.facebook.com/Pans/">
                                                <img alt="FacebookPanAm" height="40" src="/images/img-icon-facebook.png" width="40"/>
                                            </a>

                                            <a href="https://twitter.com/intent">
                                                <img alt="TwitterPanAm" height="40" src="/images/img-icon-twitter.png" width="40"/>
                                            </a>
                                        </div>

Code (markup):

 

You should use CSS for this. You can do it with floats or display: inline-block.

 

I wasnt able to do it, what would be the css code

 

a {
display: inline-block;
}

 

Uhm, anchors are already display:inline, and there is NOTHING in the code you presented to make the images OR their anchors drop to separate lines. The problem must be in your EXISTING CSS somewhere.

Though with that widget-text class that likely means the train wreck bloated laundry list of how NOT to build a website that is the typical turdpress template, so good luck with that!

 

That is true. Somewhere in the CSS there is a rule: display: block for the anchors.

Should be:
.widget-text a { display: inline-block; }

or even:
.widget-text a { display: inline-block !important; }