2 estilos de links en una misma linea

[American2010]

2 Links distintos en una misma linea...

¿Me ayudan a ver como lo hago?

Como se ve ahora los links en cuestion es así...



Yo quisiera que se vean así

Zendoku • Sin Comentarios

Si bien se me ocurre que la solucion sería crearle 2 nuevos divs, no estoy seguro...

Les dejo los códigos de todo lo que entra en juego para mostrar eso en pantalla...

Esto en el sidebar que lo presenta en pantalla

Código PHP:

 <div id="tab1" class="tabcontent">
<ul>
<?php query_posts('showposts=5&orderby=date'); ?>
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a> &bull; <?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentarios'); ?></li>
<?php endwhile; ?>
</ul>
</div>  

Y en style.css lo relacionado con ese div estaría aca

Código PHP:

  .tabcontent {
    display: none;
    background: #FFF url(images/tabtop.gif) no-repeat top;
    border: 1px solid #eee;
    border-top: 0;
    padding-top: 15px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    overflow: hidden;
    font-size: 11px;
}

.tabcontent a, .tabcontent a strong {
    color: #2c78b9;
    line-height: 1.4em;
    font-size: 14px;
}

.tabcontent a:hover, .tabcontent a:hover strong {
    color: #5ea2e7;
}

.tabcontent ul li {
    display: block;
    background: url(images/bullet.gif) no-repeat;
    background-position: left 5px;
    border-bottom: 1px dotted #ddd;
    padding-bottom: 5px;
    margin-bottom: 5px;
    padding-left: 20px;
    color: #999;
    line-height: 1.4em;
    font-size: 11px
}

.tabcontent ul li a {
    color: #2c78b9;
    line-height: 1.4em;
}

.tabcontent ul li a:hover {
    color: #5ea2e7;
}

.tabcontent ul li span {
    display: block;
    color: #999;
}
/***************** CSS For TAB Content *******************/
@media print {
    .tabcontent {
    display: block !important;
    }
} 
   

[willyfc]

mira:
puede ser una solución, en vez de poner en el css .tabcontent a por que no le creas mejor una clase a cada vinculo, es decir:

Código:

.vinculo1 a{ color:#FF0000; text-decoration:none;}
.vinculo2 a{ color:#00FF00; text-decoration:none;}

y en tu codigo html pones cada vinculo entre span:

Código PHP:

 <div id="tab1" class="tabcontent">
<ul>
<?php query_posts('showposts=5&orderby=date'); ?>
<?php while (have_posts()) : the_post(); ?>
<li>
     <span class="vinculo1>
              <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?>
              </a>
     </span
      &bull; 
     <span class="vinculo2">
             <?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentarios'); ?></li>
<?php endwhile; ?>
    </span
</ul>
</div>  

espero te sirva..

[American2010]

Gracias...

Me sirvió muchísimo...

Les muestro como quedó la solución... (Bueno, solución no, saber como se hacen las cosas, cosa que yo no sabía porque todo esto lo toco de oído y meto mano de caradura que soy simplemente)



El CSS lo dejé así

Código PHP:

  .tabcontent {
    display: none;
    background: #FFF url(images/tabtop.gif) no-repeat top;
    border: 1px solid #eee;
    border-top: 0;
    padding-top: 15px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    overflow: hidden;
    font-size: 11px;
}

.tabcontent ul li {
    display: block;
    background: url(images/bullet.gif) no-repeat;
    background-position: left 5px;
    border-bottom: 1px dotted #ddd;
    padding-bottom: 5px;
    margin-bottom: 5px;
    padding-left: 20px;
    color: #999;
    line-height: 1.4em;
    font-size: 11px;
}
.tabcontent1 a, .tabcontent1 a strong {
    color: #2c78b9;
    line-height: 1.4em;
    font-size: 14px;
}

.tabcontent1 a:hover, .tabcontent1 a:hover strong {
    color: #5ea2e7;
}

.tabcontent1 ul li a {
    color: #2c78b9;
    line-height: 1.4em;
}

.tabcontent1 ul li a:hover {
    color: #5ea2e7;
}

.tabcontent1 ul li span {
    display: block;
    color: #999;
}



.tabcontent2 a, .tabcontent2 a strong {
    color: #636363;
    line-height: 1.4em;
    font-size: 10px;
}

.tabcontent2 a:hover, .tabcontent2 a:hover strong {
    color: #999;
}

.tabcontent2 ul li a {
    color: #636363;
    line-height: 1.4em;
}

.tabcontent2 ul li a:hover {
    color: #999;
}

.tabcontent2 ul li span {
    display: block;
    color: #999;
} 
   

y el sidebar así

Código PHP:

 <div id="tab1" class="tabcontent">
<ul>
<?php query_posts('showposts=5&orderby=date'); ?>
<?php while (have_posts()) : the_post(); ?>
<li><span class="tabcontent1"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></span> &bull; <span class="tabcontent2"><?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentarios'); ?></span></li>
<?php endwhile; ?>
</ul>
</div>  

Gracias nuevamente por la ayuda...

[Jamati]

Hola American2010, cual es la página para la cual están implementando todo esto ?

de curioso nomas, porque parece linda en formato y colores

[American2010]

Iniciado por Jamati

Hola American2010, cual es la página para la cual están implementando todo esto ?

de curioso nomas, porque parece linda en formato y colores

Bueno te comento, es un sitio que estoy armando donde hago mis análisis de juegos PSP.
No me parece usar el Foro para dar promoción (bueno, si me parece) pero como aún está en desarrollo y estoy modificando mucho el tema utilizado, prefiero dejarte el link al mismo para que lo investigues...

Es un tema de Wordpress llamado Blue-Dream (entre algunos cambios, le modifiqué el alto de la barra superior, también hice 100 pix más ancho el espacio para los posts y 100px menos al sidebar, modifique la zona de los ads, etc. Se que son cosas que suenan fáciles, pero para alguien sin experiencia como yo es todo una aventura)

Este link para descargarlo
http://wordpress.org/extend/themes/blue-dream#post-411

La preview aca
http://wp-themes.com/blue-dream/

[Jamati]

Están muy lindos y suaves los colores que implementó.

La verdad que para adaptarlo da gusto, ya que lo que me había parecido muy importante era la combinación de colores.

Muy lindo, avisa cuando la tengas terminada.