Issues with image alignment in CSS & PHP - css

Question

I'm very new to the process of CSS & PHP but with Wordpress & the widgets I'm trying to get better with my plugins.
I am trying to get my little twitter bird to appear next to my twitter content message, but it continues to be at the top of the messages.
An example of what I'm trying to achieve can be located here. http://globe-trekking.com/twitter_ideal.jpg (can't add image because this is my first post)
How can I over come this.
My relevant PHP code is:
$widgetContent .= "<span class='entry-content'><img class='twitter_bird' src='http://globe-trekking.com/running/wp-content/themes/newscast/images/bird_blue_16.png'>{$entryContent}</span>";
the full PHP code is:
$widgetContent .= '<ul>';
if ( ! is_array( $tweets ) || count( $tweets ) == 0 ) {
$widgetContent .= '<li class="wpTwitterWidgetEmpty">' . __( 'No Tweets Available', $this->_slug ) . '</li>';
} else {
$count = 0;
foreach ( $tweets as $tweet ) {
// Set our "ago" string which converts the date to "# ___(s) ago"
$tweet->ago = $this->_timeSince( strtotime( $tweet->created_at ), $args['showts'], $args['dateFormat'] );
//$entryContent .= '<li>';
$entryContent = apply_filters( 'widget_twitter_content', $tweet->text, $tweet );
$widgetContent .= "<span class='entry-content'><img class='twitter_bird' src='http://globe-trekking.com/running/wp-content/themes/newscast/images/bird_blue_16.png'>{$entryContent}</span>";
$widgetContent .= " <span class='entry-meta'>";
$widgetContent .= "<span class='time-meta'>";
$linkAttrs = array(
'href' => "http://twitter.com/{$tweet->user->screen_name}/statuses/{$tweet->id_str}"
);
$widgetContent .= $this->_buildLink( $tweet->ago, $linkAttrs );
$widgetContent .= '</span>';
if ( 'true' != $args['hidefrom'] ) {
$from = sprintf( __( 'from %s', $this->_slug ), str_replace( '&', '&', $tweet->source ) );
$widgetContent .= " <span class='from-meta'>{$from}</span>";
}
if ( !empty( $tweet->in_reply_to_screen_name ) ) {
$rtLinkText = sprintf( __( 'in reply to %s', $this->_slug ), $tweet->in_reply_to_screen_name );
$widgetContent .= ' <span class="in-reply-to-meta">';
$linkAttrs = array(
'href' => "http://twitter.com/{$tweet->in_reply_to_screen_name}/statuses/{$tweet->in_reply_to_status_id_str}",
'class' => 'reply-to'
);
$widgetContent .= $this->_buildLink( $rtLinkText, $linkAttrs );
$widgetContent .= '</span>';
}
$widgetContent .= '</span>';
if ( 'true' == $args['showintents'] ) {
$widgetContent .= ' <span class="intent-meta">';
$lang = $this->_getTwitterLang();
if ( !empty( $lang ) )
$linkAttrs['data-lang'] = $lang;
$linkText = __( 'Reply', $this->_slug );
$linkAttrs['href'] = "http://twitter.com/intent/tweet?in_reply_to={$tweet->id_str}";
$linkAttrs['class'] = 'in-reply-to';
$linkAttrs['title'] = $linkText;
$widgetContent .= $this->_buildLink( $linkText, $linkAttrs );
$linkText = __( 'Retweet', $this->_slug );
$linkAttrs['href'] = "http://twitter.com/intent/retweet?tweet_id={$tweet->id_str}";
$linkAttrs['class'] = 'retweet';
$linkAttrs['title'] = $linkText;
$widgetContent .= $this->_buildLink( $linkText, $linkAttrs );
$linkText = __( 'Favorite', $this->_slug );
$linkAttrs['href'] = "http://twitter.com/intent/favorite?tweet_id={$tweet->id_str}";
$linkAttrs['class'] = 'favorite';
$linkAttrs['title'] = $linkText;
$widgetContent .= $this->_buildLink( $linkText, $linkAttrs );
$widgetContent .= '</span>';
}
//$widgetContent .= '</li>';
if ( ++$count >= $args['items'] )
break;
}
}
$widgetContent .= '</ul>';
My CSS code is:
.widget_twitter div {
padding:0;
width:280px;
}
.widget_twitter ul li {
margin-bottom:5px;
margin-left:0px;
clear:both;
}
.widget_twitter a {
text-decoration:none;
color:#333333;
margin: 0 10px 10px 0;
}
.widget_twitter a:visited {
text-decoration:underline;
color:#FF00FF;
}
.widget_twitter a:hover {
text-decoration:underline;
color:#0000CC;
}
.widget_twitter .follow-button,
.widget_twitter .xavisys-link {
margin:0 10px 10px 25px;
}
.widget_twitter .entry-content {
width:260px;
display: inline-block;
line-height:22px;
margin-top:10px;
margin-left: 13px;
}
.widget_twitter .entry-content twitter_bird {
vertical-align:middle;
}
.widget_twitter .entry-meta {
display:block;
font-size:80%;
margin-bottom: 10px;
margin-left: 13px;
}
.widget_twitter .intent-meta a {
background-image: url('images/everything-spritev2.png'); /** from Twitter resources */
display: inline-block;
text-indent: -9999px;
margin: 0 10px 10px 0;
height: 16px;
width: 16px;
}
.widget_twitter .in-reply-to-meta {
margin: 0 10px 10px 0;
}
.widget_twitter .intent-meta a.in-reply-to {
background-position: 0 center;
}
.widget_twitter .intent-meta a:hover.in-reply-to {
background-position: -16px center;
}
.widget_twitter .intent-meta a.favorite {
background-position: -32px center;
}
.widget_twitter .intent-meta a:hover.favorite {
background-position: -48px center;
}
.widget_twitter .intent-meta a.retweet {
background-position: -80px center;
}
.widget_twitter .intent-meta a:hover.retweet {
background-position: -96px center;
}
Any assistance would be greatly appreciated. I've managed to get it to a "decent" appearance, but otherwise, this is the last step that I've tried a number of things on.
Regards,
Daniël

Answer 1

Sorry for fast answer, may be me wrong, but try to use float:left for bird image.