como modificar css

[floresalud]

como modificar el css

para ver social en una sola linea.

div.itemSocialSharing {padding:8px 0;}
div.itemTwitterButton {float:left;margin:2px 24px 0 0;}
div.itemFacebookButton {float:left;margin-right:24px;width:200px;}
div.itemGooglePlusOneButton {}

muchas gracias por la ayuda.

[emprear]

muy claro no me queda lo que esxpresas, pero supongo que si a la primer y ultima capa tambien les das float: left; se te va a corregir

Saludos

[floresalud]

he realizado la modificación como dices sin resultados

Ej.

[URL="http://www.plagasexpress.es/index.php?option=com_k2&view=item&id=2:no-de-brazos-cruzados&Itemid=193"]ver resultado[/URL]

[IsaBelM]

añade a tu css algo como esto

.itemSocialSharing div {
display: inline-block;
}

[floresalud]

El codigo del social en el artículo es:

<table width="100%" border="0" cellspacing="10" cellpadding="0">
<tr>
<td width="100%">
<?php if($this->item->params->get('itemTwitterButton',1) || $this->item->params->get('itemFacebookButton',1) || $this->item->params->get('itemGooglePlusOneButton',1)): ?>
<!-- Social sharing --><div class="itemSocialSharing">
<?php if($this->item->params->get('itemTwitterButton',1)): ?>
<!-- Twitter Button -->
<div class="itemTwitterButton">
<a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal"<?php if($this->item->params->get('twitterUsername')): ?> data-via="<?php echo $this->item->params->get('twitterUsername'); ?>"<?php endif; ?>><?php echo JText::_('K2_TWEET'); ?></a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
</div>
&nbsp;&nbsp;

<?php if($this->item->params->get('itemFacebookButton',1)): ?>
<!-- Facebook Button -->
<div class="itemFacebookButton">
<div id="fb-root"></div>
<script type="text/javascript">
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#appId=177111755694317&xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-like" data-send="false" data-width="200" data-show-faces="true"></div>
</div>
&nbsp;&nbsp;

<?php if($this->item->params->get('itemGooglePlusOneButton',1)): ?>
<!-- Google +1 Button -->
<div class="itemGooglePlusOneButton">
<g:plusone annotation="inline" width="120"></g:plusone>
<script type="text/javascript">
(function() {
window.___gcfg = {lang: 'en'}; // Define button default language here
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<?php endif; ?>
<?php endif; ?>
<?php endif; ?>

<div class="clr"></div>
</div>
<?php endif; ?>
</td>
</tr>
</table>

El codigo en el css:

.itemSocialSharing div {
display: inline-block;
}

div.itemSocialSharing {float:left;padding:8px 0;}
div.itemTwitterButton {float:left;margin:2px 24px 0 0;}
div.itemFacebookButton {float:left;margin-right:24px;width:200px;}
div.itemGooglePlusOneButton {float:left;}

El resultado se sigue viendo los iconos del social en líneas diferentes, es decir, uno debajo del otro.

Gracias por la ayuda.

[emprear]

y pregunto
dónde estan definidas esas clases?
por ejemplo .itemSocialSharing
no las veo en ningun css, ni externo ni inline

[floresalud]

los div class

son lo que me estan jodiendo

porque el social se ven los iconos uno en cada línea

Y lo que quiero conseguir es que se vean los 3 iconos sharing social en la misma línea separandolos en celdas o con un espacio adecuado entre los mismos.

[emprear]

amigo, lo que mostrás es el php, este genera un html, pero el css brilla por su ausencia. Además es bastante caótico

probá lo siguiente

sacá toda esta tabla

Código HTML:

<table width="100%" border="0" cellspacing="10" cellpadding="0">
    <tr>
      <td width="100%">
                <!-- Social sharing --><div class="itemSocialSharing">
                <!-- Twitter Button -->
        <div class="itemTwitterButton">
            <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="floresalud">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
 
        </div>
        &nbsp;&nbsp;
              
                <!-- Facebook Button -->
        <div class="itemFacebookButton">
            <div id="fb-root"></div>
            <script type="text/javascript">
                (function(d, s, id) {
                  var js, fjs = d.getElementsByTagName(s)[0];
                  if (d.getElementById(id)) {return;}
                  js = d.createElement(s); js.id = id;
                  js.src = "//connect.facebook.net/en_US/all.js#appId=177111755694317&xfbml=1";
                  fjs.parentNode.insertBefore(js, fjs);
                }(document, 'script', 'facebook-jssdk'));
            </script>
            <div class="fb-like" data-send="false" data-width="200" data-show-faces="true"></div>
        </div>
 
        &nbsp;&nbsp;
        
              <!-- Google +1 Button -->
        <div class="itemGooglePlusOneButton">   
            <g:plusone annotation="inline" width="120"></g:plusone>
            <script type="text/javascript">
              (function() {
                window.___gcfg = {lang: 'en'}; // Define button default language here
                var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
                po.src = 'https://apis.google.com/js/plusone.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
              })();
            </script>
        </div>
                                
        <div class="clr"></div>
    </div>
        </td>
 
      </tr>
</table>
 

y reemplazala por esto

Código HTML:

<div style="clear:both;"></div>
<div class="redes">
    
<div class="itemTwitterButton">
código twitter
</div>
<div class="itemFacebookButton">
código facebook
</div>
<div class="itemGooglePlusOneButton">   
código goolge +
</div>
</div>
<div style="clear:both;"></div>
 

dónde dice "codigo ..." insertá el código para generar los botones de cada red

y finalmente en tu css agregá

Código CSS:

.itemTwitterButton, .itemFacebookButton, .itemGooglePlusOneButton{
float: left;
margin-right: 5px;
border: solid 1px #666;
}
 

el borde se lo podés quitar, lo puse para que lo visualices mejor.

Saludos

[IsaBelM]

pues tendrás que domar a tus navegadores