Facebook comment formatting

I added the Facebook comment code in to a Wordpress comment

<?php if ( comments_open() ) : ?>
<li class="reviews_tab"><a href="#tab-reviews"><div id="fb-root">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<?php echo '<fb:comments-count href=http://bikeroger.com';
echo $_SERVER["REQUEST_URI"];
echo '></fb:comments-count> Awesome Love'; ?>
</a></li>
<br>
<?php endif; ?>

The result is what I wanted, but the styling is not.

Here's site and a screenshot:

As you can see from the image. the text for "1656 Awesome Words" is smaller than "Description" & "Additional Information"

How can I make the font sizes the same?

Answers


<?php if ( comments_open() ) : ?>
<li class="reviews_tab"><a href="#tab-reviews"><div id="fb-root">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<?php echo '<fb:comments-count href=http://bikeroger.com';
echo $_SERVER["REQUEST_URI"];
echo '></fb:comments-count> Awesome Love'; ?>
</a></li>
<br>
<?php endif; ?>

Above your original code...

Below a minor alteration

<?php if ( comments_open() ) : ?>
<li class="reviews_tab"><a href="#tab-reviews"><div id="fb-root">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<?php echo '<fb:comments-count href=http://bikeroger.com';
echo $_SERVER["REQUEST_URI"];
echo '></fb:comments-count> Awesome Love'; ?>
</div></a></li>
<br>
<?php endif; ?>

inside your li and a tags you open a div tag "fb-root" but you are not closing it before closing the a and li tags. Thus having a broken tag, this may or may not be part of the issue directly but having broken unclosed tags can sometimes result in adverse undesired effects.

Also Im gonna take a wild guess and assume you have multiple div's with the ID fb-root on your page, which may also be causing conflict. However all in all. It being in the fb-root div, the facebook styling is overriding your styling as FB loads its styling after page load. So your comment tag is inheriting its styling rather than your initial styling. Facebook through that javascript you include for it, is basically rewriting the css/style properties of all elements within the fb-root div after its loaded into the DOM.


Need Your Help

Checking ActiveMQ queue is empty from JMeter

activemq jmeter

I am running a performance test using JMeter for our application and the there is some asynchronous processing in the form of events on an ActiveMQ queue. I want to wait for the ActiveMQ queue to be

Better enums in C (Arduino)

c struct enums arduino

I thought the below was a neat way to implement enums in C.