[Error] 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:
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:
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):-moz-border-radius: 7px;
-webkit-border-radius: 7px;
PD: pueds variar los pixeles de "giro", por asi decirlo, modificando el "7px"
Quote:moz-border-radius: 7px;Los coloque sin el - espero que por eso no haya problema.
webkit-border-radius: 7px;
tambien quisiera saber para redondear los avatares...
Los spoilers y el texto citado no se redondea
Los spoilers depende de qué código tengan.
El texto citado es quote.
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:
y en el global css se agrega esto:
y yo lo coloque asi:
http://vortexforum.byethost9.com/showthread.php?tid=181
Y el codigo (mycode) es asi:
<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 mycodey en el global css se agrega esto:
.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:
.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;
}
Es así:
Y NO es así:
-moz-border-radius: 7px;
-webkit-border-radius: 7px;Y NO es así:
moz-border-radius: 7px;
webkit-border-radius: 7px;