Redondear esquinas del foro

URL del foro: http://www.vortexforum.tk
Versión del foro: 1.6
Actualización: Ninguna

Como se puede ver, es este foro hay un estilo rendondeado, sin esquinas, yo desde hace tiempo intente hacer lo mismo (antes de que reseteara mi foro) sin resultado alguno, me pueden decir como hacer eso?

Esto para mí, es una de las cosas más complicadas, primero vamos a
AdminCP -> Plantillas y Estilos -> Estilos -> Tu theme -> Agregar Hoja de Estilo
Nombre: css3.css
La segunda opcion dejala como esta (Globalmente)
La tercera pon: agregar mi propio código:
Y agrega:

Código:
tr td.trow1:first-child,

tr td.trow2:first-child,

tr td.trow_shaded:first-child {

    border-left: 0;

}

tr td.trow1:last-child,

tr td.trow2:last-child,

tr td.trow_shaded:last-child {

    border-right: 0;

}

.tborder {

    -moz-border-radius: 7px;

    -webkit-border-radius: 7px;

    border-radius: 7px;

}

.thead,

.rounded_top {

    -moz-border-radius-topleft: 6px;

    -moz-border-radius-topright: 6px;

    -webkit-border-top-left-radius: 6px;

    -webkit-border-top-right-radius: 6px;

    border-top-left-radius: 6px;

    border-top-right-radius: 6px;

}

.tfoot,

.rounded_bottom {

    -moz-border-radius-bottomleft: 6px;

    -moz-border-radius-bottomright: 6px;

    -webkit-border-bottom-left-radius: 6px;

    -webkit-border-bottom-right-radius: 6px;

    border-bottom-left-radius: 6px;

    border-bottom-right-radius: 6px;

}

input.textbox,

select,

textarea,

.editor_control_bar,

fieldset,

.popup_menu {

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    border-radius: 5px;

}

.popup_menu .popup_item_container:first-child .popup_item {

    -moz-border-radius-topleft: 4px;

    -moz-border-radius-topright: 4px;

    -webkit-border-top-left-radius: 4px;

    -webkit-border-top-right-radius: 4px;

    border-top-left-radius: 4px;

    border-top-right-radius: 4px;    

}

.popup_menu .popup_item_container:last-child .popup_item {

    -moz-border-radius-bottomleft: 4px;

    -moz-border-radius-bottomright: 4px;

    -webkit-border-bottom-left-radius: 4px;

    -webkit-border-bottom-right-radius: 4px;

    border-bottom-left-radius: 4px;

    border-bottom-right-radius: 4px;

}

.pagination a {

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    border-radius: 5px;

}

Y luego, vas al global.css, y en los lugares que quieres redondear, (Ej: Los Theads, o Tcats, agrega dos atributos (siempre los mismos):

Código:
-moz-border-radius: 7px;

-webkit-border-radius: 7px;

PD: pueds variar los pixeles de "giro", por asi decirlo, modificando el "7px"

Última modificación: 29 Nov, 2010, 7:45 pm por Aeroxis.

Cita:moz-border-radius: 7px;
webkit-border-radius: 7px;

Los coloque sin el - espero que por eso no haya problema.
tambien quisiera saber para redondear los avatares...

Los spoilers y el texto citado no se redondea Undecided

Última modificación: 29 Nov, 2010, 8:02 pm por dualchu.

Los spoilers depende de qué código tengan.

El texto citado es quote.

Aqui se puede ver como son los spoilers:
http://vortexforum.byethost9.com/showthread.php?tid=181

Y el codigo (mycode) es asi:

Código PHP:
<div>
<div class="pre-spoiler">
<span style="float: left; padding-top: 2px;">Spoiler</span> <input value="Mostrar" style="width: 80px; font-size: 12px; margin: 0px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Esconder'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Mostrar';}" type="button">
</div>
<div>
<div class="spoiler" style="display: none;">$1<br />

</div>
</div>
</div> 

Ese es el texto a remplazar en mycode

y en el global css se agrega esto:

Código PHP:
.pre-spoiler {
    border: 1px solid #005F96;
    margin: 0 15px 5px 15px;
    background: #DEEAEF;
    padding: 3px 5px 3px 5px;
    font-weight: bold;
    text-align: right;
    color: #5A6373;
}

.spoiler {
    background: #DEEAEF;
    margin: 0 15px 15px 15px;
    padding: 5px;
    border: 1px solid #005F96;
    } 

y yo lo coloque asi:

Código PHP:
.pre-spoiler {
    border: 1px solid #005F96;
    margin: 0 15px 5px 15px;
    background: #DEEAEF;
    padding: 3px 5px 3px 5px;
    font-weight: bold;
    text-align: right;
    color: #5A6373;
    moz-border-radius: 7px;
    webkit-border-radius: 7px;
}

.spoiler {
    background: #DEEAEF;
    margin: 0 15px 15px 15px;
    padding: 5px;
    border: 1px solid #005F96;
    moz-border-radius: 7px;
    webkit-border-radius: 7px;
} 

Última modificación: 30 Nov, 2010, 9:06 am por dualchu.

Es así:

Código:
-moz-border-radius: 7px;

-webkit-border-radius: 7px;

Y NO es así:

Código:
moz-border-radius: 7px;

webkit-border-radius: 7px;

Última modificación: 30 Nov, 2010, 9:39 am por Cluster.