Página 1 de 1
ancho de foro y sombra
Publicado: 03 Dic 2009, 11:29
por micasamitelefono
Hola, como ya he puesto en otros hilos, aunque por otras cuestiones, con motivo de la navidad he cambiado el style temporalmente, he puesto uno muy guapo Chrimbo se llama, os añado una captura para que quede mas clara mi duda.
El tema es el siguiente
1 en common.css tengo esto
#wrap {
padding: 0 20px;
min-width: 700px;
width: 900px;
margin: 0 auto;
}
, entiendo que los 900 son los que marca el azul celeste, bueno ya está explicado en la foto, quisiera saber ¿cómo especifico la cantidad de cuadrado blanco que se ve y donde se especifica que debe ser blanco, creo que se entiende bien. Muchas gracias por adelantado
Re: ancho de foro y sombra
Publicado: 05 Dic 2009, 12:09
por JANU1535
Los colores por lo general se definen en el archivo
colours.css del mismo directorio.
El valor exacto no te lo puedo decir, depende de la plantilla.
Por ahí está la propiedad background-color, pero no se si el color ese es un 'color' o una imagen repetida hasta el infinito.
Saludos.
Re: ancho de foro y sombra
Publicado: 05 Dic 2009, 12:15
por micasamitelefono
lo que pretendo es en mi plantilla prosilver añadir ese recuadro blanco para que la imagen de fondo no se vea así por el medio de los bloques, y no encuentro en donde hacerlo,lo unico que he encontrado diferente entre las dos plantillas es en common.css un trozo que pone border, pero lo añado y sigue igual(adjunto el codigo)./* Border
---------------------------------------- */
.border-left {
background: url("{T_THEME_PATH}/images/border_left.gif") #FFFFFF repeat-y 0 0;
}
.border-right {
background: url("{T_THEME_PATH}/images/border_right.gif") repeat-y 100% 0;
}
.border-top {
background: url("{T_THEME_PATH}/images/border_top.gif") repeat-x 0 0;
}
.border-top-left {
background: url("{T_THEME_PATH}/images/border_top_left.gif") no-repeat 0 0;
}
.border-top-right {
background: url("{T_THEME_PATH}/images/border_top_right.gif") no-repeat 100% 0;
width: 100%;
}
.border-bottom {
background: url("{T_THEME_PATH}/images/border_bottom2.gif") repeat-x 0 100%;
}
.border-bottom span {
background: url("{T_THEME_PATH}/images/border_bottom.gif") no-repeat 0 0;
display: block;
height: 18px;
}
.border-bottom span span {
background-position: 100% -18px;
}
.inside {
padding: 17px 27px 10px 27px;
}
Re: ancho de foro y sombra
Publicado: 05 Dic 2009, 19:56
por memoadian
ah pues mira como lo tengo yo te puedo decir como le hize.
a ver empiezo
para ello abre el archivo:
styles/prosilver/theme/common.css
busca
remplaza por:
Código: Seleccionar todo
#wrap {
padding: 0 20px;
min-width: 650px;
width: 80%;
margin: 0 auto;
}
crea un fondo como tu quieras y nombralo background
abre el colours.css
busca
Código: Seleccionar todo
html, body {
color: #536482;
background-color: #FFFFFF;
}
remplaza por:
Código: Seleccionar todo
html, body {
color: #536482;
background-color: #FFFFFF;
background-image: url("{T_THEME_PATH}/images/background.gif/jpeg/png");
background-position: center;
background-repeat: no-repeat;
background-attachment:fixed;
}
luego busca:
agrega despues:
Código: Seleccionar todo
/*
--------------------------------------------------------------
Corners exteriores
-------------------------------------------------------------- */
.top-left, .top-right, .bottom-left, .bottom-right {
background-image: /* CHANGE: path and name of your image */
height: 10px; /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
font-size: 2px; /* DNC: correction IE for height of the <div>'s */
}
.top-left, .bottom-left {
margin-right: 10px; /* CHANGE: replace by the width of one of your corners */
}
.top-right, .bottom-right {
margin-left: 10px; /* CHANGE: replace by the width of one of your corners */
margin-top: 0px; /* CHANGE: replace by the height of one of your corners */
}
.top-right {
background-position: 100% 0; /* DNC: position right corner at right side, no vertical changes */
}
.bottom-left {
background-position: 0 -10px; /* CHANGE: replace second number by negative height of one of your corners */
}
.bottom-right {
background-position: 100% 0px; /* CHANGE: replace second number by negative height of one of your corners */
}
.inside {
border-left: 1px solid #000; /* YCC: color & properties of the left-borderline */
border-right: 1px solid #000; /* YCC: color & properties of the right-borderline */
border-top: 1px solid #000;
border-bottom: 1px solid #000;
background: #FFFFFF; /* YCC: background-color of the inside */
color: #394B5F; /* YCC: default text-color of the inside */
padding-left: 0px; /* YCC: all texts at some distance of the left border */
padding-right: 0px;
padding-top: 10px; /* YCC: all texts at some distance of the right border */
}
.notopgap { margin-top: 0; } /* DNC: to avoid splitting of the box */
.nobottomgap { margin-bottom: 0; } /* DNC: to avoid splitting of the box */
.outside {
margin: 0 auto;
width : 950px;
padding: 0px;
}
luego abre el common.css
y deja tu wrap así:
Código: Seleccionar todo
#wrap {
padding: 0 10px;
min-width: 700px;
width: 930px;
margin: 0 auto;
}
y el body así
Código: Seleccionar todo
body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: Verdana, Helvetica, Arial, sans-serif;
color: #828282;
background-color: #FFFFFF;
/*font-size: 62.5%; This sets the default font size to be equivalent to 10px */
font-size: 10px;
margin: 0;
padding: 0px 0;
}
abre el overall header y busca:
Código: Seleccionar todo
</head>
<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">
agrega después
Código: Seleccionar todo
<div class="outside">
<div class="top-left"></div><div class="top-center"></div><div class="top-right"></div>
<div class="inside">
<div class="notopgap">
busca en el overall footer esto:
y agrega antes esto:
Código: Seleccionar todo
<div class="nobottomgap"></div>
</div>
<div class="bottom-left"></div><div class="bottom-center"></div><div class="bottom-right">
</div>
sube tus archivos limpia cache y tambien la cache de tu estilo y ya si quieres ver como queda puedes ver mi foro.
GRACIAS A DAVIDU DE http://coloreatuforo.com/
Re: ancho de foro y sombra
Publicado: 05 Dic 2009, 20:37
por jakk
micasamitelefono escribió:lo que pretendo es en mi plantilla prosilver añadir ese recuadro blanco para que la imagen de fondo no se vea así por el medio de los bloques, y no encuentro en donde hacerlo,lo unico que he encontrado diferente entre las dos plantillas es en common.css un trozo que pone border, pero lo añado y sigue igual(adjunto el codigo)./* Border
---------------------------------------- */
.border-left {
background: url("{T_THEME_PATH}/images/border_left.gif") #FFFFFF repeat-y 0 0;
}
.border-right {
background: url("{T_THEME_PATH}/images/border_right.gif") repeat-y 100% 0;
}
.border-top {
background: url("{T_THEME_PATH}/images/border_top.gif") repeat-x 0 0;
}
.border-top-left {
background: url("{T_THEME_PATH}/images/border_top_left.gif") no-repeat 0 0;
}
.border-top-right {
background: url("{T_THEME_PATH}/images/border_top_right.gif") no-repeat 100% 0;
width: 100%;
}
.border-bottom {
background: url("{T_THEME_PATH}/images/border_bottom2.gif") repeat-x 0 100%;
}
.border-bottom span {
background: url("{T_THEME_PATH}/images/border_bottom.gif") no-repeat 0 0;
display: block;
height: 18px;
}
.border-bottom span span {
background-position: 100% -18px;
}
.inside {
padding: 17px 27px 10px 27px;
}
aparte de añadir ese codigo en el comon.css tendras que definir los bordes en el overall_header y overall_footer mediante div
abriendo el div en el overall_header y cerrandolo en el overall_footer
Re: ancho de foro y sombra
Publicado: 05 Dic 2009, 22:00
por micasamitelefono
pues muchisimas gracias memoadian, ahora no me resulta posible probarlo, pero en cuanto retome el curro lo intento, el iercoles, eso si, me parece genial toda tu solucion y de hehco viendo tu foro, es lo que busco, pero me pregunto en el tema actual de mi web chrimbo, no veo todo este codigo en colours, me podrías decir como tratan este tema en ella?, es curiosidad y me pica tanto que quiero descubrirlo, he estado comparando los colours de prosilver y chrimbo y difieren poco o muy poco, y no acabo de entenderlo, pero bueno que tu sol. me gusta y la pondré en practica. Gracias
Re: ancho de foro y sombra
Publicado: 08 Dic 2009, 11:52
por micasamitelefono
SOLUCIONADO. Bueno pues al final he seguido los consejos de jakk, y voilá, lo tengo listo, efectivamente el problema estaba en que faltaban los div de apertura en header y footer (los de cierre) Gracias
Re: ancho de foro y sombra
Publicado: 08 Dic 2009, 20:11
por JANU1535
Tenemos buenos usuarios en este foro.
Qué cracks!!!
Re: ancho de foro y sombra
Publicado: 10 Dic 2009, 14:04
por micasamitelefono
si si, mas bien que jakkssss!!!!! jajajaj
