making image and text to come beside each other in a div

Question

I wrote a code as shown here.
You can see that image is coming on top and text is going down. I want both image and text to come in same line.
CSS:

#menu{
    background: #003663 repeat scroll 0% 0%;
    width: 100%;
    min-width: 1000px;
    height: 63px;
}
#menu #plc{
    width: 82%;
    margin: 0px auto;
    overflow: hidden;
}
#menu #plc #register{
    color: #fff;
    font-size: 21px;
    margin: 1% 0 0 0;
    background-color: red;
    width: 12%;
}
#menu #plc #register img{
    width: 15.5%;
    margin-left: 7%;
}  

How can I do it?

Answer 1

Try this:

CSS

#register img, #register div{
    display:inline-block;
    vertical-align: middle;
}

DEMO HERE