Foros del Web » Creando para Internet » CSS »

2 bordes de 2 colores distintos en un mismo DIV

Estas en el tema de 2 bordes de 2 colores distintos en un mismo DIV en el foro de CSS en Foros del Web. como puedo crear 2 bordes juntos de 2 colores distintos? o 1 solo borde de 2 colores distintos en el ancho. si utilizo esto: " ...
  #1 (permalink)  
Antiguo 04/06/2011, 05:26
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
2 bordes de 2 colores distintos en un mismo DIV

como puedo crear 2 bordes juntos de 2 colores distintos? o 1 solo borde de 2 colores distintos en el ancho.


si utilizo esto: " 2px ridge #CCCCCC " me crea el borde doble que quiero pero solo me deja elegir el color de uno, y el otro se queda negro siempre


como puedo cambiar el color de ambos?



y otra dudilla algo relacionada, por no abrir otro post, si quiere poner un mismo borde pero solo a la izquierda y derecha del DIV ( pero no arriba y abajo ), tengo que poner: " border-left: ... ; border-right: ... ; " ,
hay alguna manera abreviada de ponerlo, por ejemplo asi:
" border-left,border-top,border-right: 2px ridge #CCCCCC ; " (esta no funciona), hay alguna forma parecida a esa de ponerlo?
  #2 (permalink)  
Antiguo 04/06/2011, 05:35
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 6 años, 5 meses
Puntos: 13
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

A tu primera pregunta es algo muy fácil.

Ponle esto al div.
Código CSS:
Ver original
  1. border: 1px solid red;
  2. outline: 1px solid blue;

Y a tu segunda pregunta por experiencia te digo que no, pero alomejor alguien sabe algún método, pero lo dudo porque no es como el margin y el padding.
  #3 (permalink)  
Antiguo 04/06/2011, 08:08
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

el OUTLINE no me funciona porque solo quiero poner borde abajo y arriba, y no existe OUTLINE-top ni bottom :(


alguna otra solucion?
  #4 (permalink)  
Antiguo 04/06/2011, 08:23
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 6 años, 5 meses
Puntos: 13
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Pues a ver especificado

De momento solo se me ocurre que crees otro div dentro o fuera de ese div.
Que quieres algo como esto?
  #5 (permalink)  
Antiguo 04/06/2011, 08:51
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 11 meses
Puntos: 538
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Al ser algo estético lo más semántico sería:
elemento::before
elemento::after
con anchura 100% y altura, background y posicionados según las necesidades

Otra vía sería con box-shadow y los valores apropiados.

En ambos casos combinados con el borde del elemento.
  #6 (permalink)  
Antiguo 04/06/2011, 09:11
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

en realidad es un borde que recorre varias capas, entonces es por arriba y abajo en una, solo por la derecha en otra..... entonces el BEFORE, AFTER no me vale, y hacerlo en varias capas seria bastante lioso.


Y las veces que e hecho sombras se veia fatal en IE....


supongo que para hacer el efecto que quiero tendré que echar mano de photoshop :\ , pero me parece raro que CSS no permita hacer un borde doble con los 2 colores que yo quiera, de la misma manera que se hace un borde simple
  #7 (permalink)  
Antiguo 04/06/2011, 09:46
Avatar de kkurosaki  
Fecha de Ingreso: junio-2011
Ubicación: Bleach (Colima, México)
Mensajes: 3
Antigüedad: 5 años, 11 meses
Puntos: 0
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
Iniciado por rulzzz Ver Mensaje
en realidad es un borde que recorre varias capas, entonces es por arriba y abajo en una, solo por la derecha en otra..... entonces el BEFORE, AFTER no me vale, y hacerlo en varias capas seria bastante lioso.
Yo no lo veo tan lioso.

Código HTML:
Ver original
  1. <div id="one">
  2. <div id="two">
  3.  
  4. CONTENIDO
  5.  
  6. </div>
  7. </div>

Código CSS:
Ver original
  1. #one {width:500px, height:500px; border: 1px solid #00f;}
  2. #two {position:relative; width:495px; height:495px; border:1px solid #f00; margin:auto;}

Saludos.
  #8 (permalink)  
Antiguo 04/06/2011, 10:53
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 11 meses
Puntos: 538
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

@rulzzz:
¿Y por qué extraña razón no facilita toda la información necesaria de una vez por todas en vez de andar soltándola con cuenta gotas y hasta parece que a regañadientes?

Comparta los códigos implicados (css+html generado) y un enlace a su realización e indique claramente sobre qué elementos quiere actuar.
  #9 (permalink)  
Antiguo 04/06/2011, 12:52
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

a cuenta gotas y a regañadientes? pero que dices.



Si planto aqui todo el codigo (que por cierto las capas estan escritas dentor de "echos" de PHP, lo que hace el codigo bastante largo) pues seguramente la gente ni se moleste en leerlo para ayudarme.


Ademas la pregunta tampoco es que fuese tan compleja como para tener que plantar todo el codigo, simplemente deberia haber especificado al principio que el borde no lo queria en las 4 paredes de la capa, sino solo en algunas, pero pense que no seria necesario especificarlo, aunque despues lo hice y ya quedo todo claro, las respuestas me han quedado perfectamente claras...
  #10 (permalink)  
Antiguo 04/06/2011, 13:02
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 6 años, 5 meses
Puntos: 13
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Haz lo que quieres en photoshop y después lo pones aquí y te decimos si se puede hacer con css o tienes que maquetarlo. Así es mas fácil para todos.
  #11 (permalink)  
Antiguo 04/06/2011, 13:08
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

no se porque os liais tanto, la pregunta esta bastante clara, como poner un borde doble de 2 colores distintos en un cualquiera de los lados de una capa.

Segun decis se puede hacer poniendo una capa distinta para cada borde, pero para hacer eso prefiero poner un borde normal y otro artificial de imagen........

pensaba que habia alguna propiedad de los "border" para hacerlo, pero segun decis no se puede hacer con la propiedad border, asi que nada.... gracias por las respuestas igualmente
  #12 (permalink)  
Antiguo 04/06/2011, 13:22
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 11 meses
Puntos: 538
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
a cuenta gotas y a regañadientes? pero que dices.
Pues mis disculpas, se ve que no he sabido ni leer ni comprender:
Cita:
Iniciado por rulzzz Ver Mensaje
como puedo crear 2 bordes juntos de 2 colores distintos? o 1 solo borde de 2 colores distintos en el ancho.
Cita:
Iniciado por rulzzz Ver Mensaje
el OUTLINE no me funciona porque solo quiero poner borde abajo y arriba, y no existe OUTLINE-top ni bottom :(
Cita:
Iniciado por rulzzz Ver Mensaje
en realidad es un borde que recorre varias capas, entonces es por arriba y abajo en una, solo por la derecha en otra.....
Y sigo con mis disculpas por la autocita que resalto en negrita
Cita:
Iniciado por kseso? Ver Mensaje
@rulzzz:
Comparta los códigos implicados (css+html generado) y un enlace a su realización e indique claramente sobre qué elementos quiere actuar.
Y sí, existe /border-top-color/ que admite múltiples valores. Pero nunca lo recomendaría en nada que no sea una simple demo. Nunca en un sitio real.
  #13 (permalink)  
Antiguo 04/06/2011, 13:51
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
Ademas la pregunta tampoco es que fuese tan compleja como para tener que plantar todo el codigo, simplemente deberia haber especificado al principio que el borde no lo queria en las 4 paredes de la capa, sino solo en algunas, pero pense que no seria necesario especificarlo, aunque despues lo hice y ya quedo todo claro, las respuestas me han quedado perfectamente claras...

KSESO realmente no se a que viene tu contestacion despues de que la pregunta quedase totalmente clara e incluso resuelta :S , pero en fin tu sabrás. Pero vamos, que si te hace ilusion ver el codigo me lo dices y te lo pongo, aunque ya te digo q solo "el codigo implicado css+html" no va a poder ser, porque como ya te he dicho antes, el codigo html lo tengo metido dentro de un "echo" de PHP, de ahí que no lo pusiera.....

Última edición por rulzzz; 04/06/2011 a las 13:59
  #14 (permalink)  
Antiguo 04/06/2011, 15:44
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 11 meses
Puntos: 538
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Supongo que el hecho de que no sepa o se de cuenta de lo descorazonador y desagradable de actuar(1) como ha hecho usted en este tema es debido a que de sus 47 mensajes todos son para pedir ayuda, excepto 1 donde respondió a una oferta de trabajo. Ni uno sólo para intentar ayudar a otro usuario.

Y la última razón para solicitar códigos implicados no es precisamente la ilusión por verlos. Pero puede pensar que lo es si eso le hace sentirse mejor.

(1) Pregunta y ofrece una información -- Respuesta -- la descarta dando información complementaria --- Respuesta -- Idem -- Respuesta -- idem ...

Y con ésta termina mi participación en este tema.
  #15 (permalink)  
Antiguo 04/06/2011, 16:52
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

vale que tu has ayudado a mucha gente y que yo no he ayudado a nadie y he abierto 8 o 9 posts pidiendo ayuda (cosa que no quita que yo haya podido ayudar en otros foros/medios), pero el hecho de que eso sea asi no justifica el que seas un borde, si no te parece bien mi post simplemente no respondas y punto.


De todas formas no creo que tenga mucho merito tu ayuda porque debes tener bastante tiempo libre si lo pierdes navegando en mis 47 mensajes para poder hacer ese comentario, pero en fin tu sabrás lo que haces, pero aqui nadie te obliga a que ayudes que si te molesta que no haya dado una informacion a tu gusto en la pregunta, pues no ayudes y deja que lo haga otro que si haya entendido mi pregunta.

Última edición por rulzzz; 04/06/2011 a las 16:58
  #16 (permalink)  
Antiguo 05/06/2011, 00:28
Avatar de seoista  
Fecha de Ingreso: septiembre-2003
Ubicación: Pues leyéndote
Mensajes: 1.076
Antigüedad: 13 años, 8 meses
Puntos: 57
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
Iniciado por rulzzz Ver Mensaje
vale que tu has ayudado a mucha gente y que yo no he ayudado a nadie y he abierto 8 o 9 posts pidiendo ayuda (cosa que no quita que yo haya podido ayudar en otros foros/medios), pero el hecho de que eso sea asi no justifica el que seas un borde, si no te parece bien mi post simplemente no respondas y punto.

De todas formas no creo que tenga mucho merito tu ayuda porque debes tener bastante tiempo libre si lo pierdes navegando en mis 47 mensajes para poder hacer ese comentario, pero en fin tu sabrás lo que haces, pero aqui nadie te obliga a que ayudes que si te molesta que no haya dado una informacion a tu gusto en la pregunta, pues no ayudes y deja que lo haga otro que si haya entendido mi pregunta.
¡Calma @rulzzz!.

@kseso? lo único que ha pretendido es ayudar (es su forma de ser, ayudar a los demás, cómo lo está demostrando día a día), si ha entendido o no tu pregunta es otra cosa y creo que con tu aptitud, no te va a ayudar nadie.

En verdad, yo tampoco he entendido lo que quieres.

Saludos.
__________________
· Lo poco que sé, lo he aprendido de AQUÍ ·
· No contesto por M.P. ·
  #17 (permalink)  
Antiguo 05/06/2011, 01:49
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 14 años, 10 meses
Puntos: 361
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Hola:

Cita:
Iniciado por rulzzz Ver Mensaje
... el codigo html lo tengo metido dentro de un "echo" de PHP...
Pero, ese "echo" de PHP, genera un HTML ¿verdad? Pues a ese HTML se refería kseso?. Y aunque a tí te parezca que no, a veces es necesario verlo porque puede haber herencias que afecten al código que al que pregunta no le funciona ¿Correcto?

Saludos.

  #18 (permalink)  
Antiguo 05/06/2011, 03:32
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
Pero, ese "echo" de PHP, genera un HTML ¿verdad? Pues a ese HTML se refería kseso?
no, el me dijo que debia copiar solo el codigo referente a mi problema, y SOLO CSS+HTML. Y despues de decirle que si no lo habia puesto era porque me era imposible poner el codigo sin las sentencias PHP al estar todo dentro de un ECHO, y el insistio despues en que "debia poner solo el codigo relacionado en CSS+HTML" ................


ademas, que me parece bastante absurda la exigencia ya que la duda habia quedado resuelta ya sin necesidad de eso, por tanto no entiendo su actitud, la gente que me respondio habia entendido la pregunta perfectamente, y a mi me han quedado claras las respuestas.

Última edición por rulzzz; 05/06/2011 a las 03:39
  #19 (permalink)  
Antiguo 05/06/2011, 05:56
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 9 años, 11 meses
Puntos: 538
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Seoista, Jomamuro:
Déjenlo estar y no fuercen más.
Dejen que piense, actúe y se comporte como quiera, que yo ya había quedado de lo más agustito con mi retirada de este tema y el usuario con su victoria y su orgásmico esparmeo de -karma a todos y cada uno de mis mensajes, hasta el #5, juas!.

Por mi parte, veo que sólo me resta explicar el significado de "los códigos implicados (css+html generado)". Pero eso será otro año

Lo dicho, vamos a dedicarnos a cuestiones más reconfortantes y placenteras.
  #20 (permalink)  
Antiguo 05/06/2011, 06:29
 
Fecha de Ingreso: octubre-2009
Mensajes: 103
Antigüedad: 7 años, 7 meses
Puntos: 2
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Cita:
Y con ésta termina mi participación en este tema.
y sin embargo, vuelves a replicar :)

y si, te di karma negativo porque no me gusta tu conducta, esto es un foro, cada uno participa/ayuda como quieres, yo no entro aqui para que me des sermones asi que si no te gusta mi forma de preguntar no hace falta que me juzgues sin conocerme de nada, simplemente ignorame, no me respondas, y listo. Porque soltarme el rollo despues de que el tema quedase zanjado porque ya me habian resuelto la duda, sobraba.
  #21 (permalink)  
Antiguo 05/06/2011, 12:42
Avatar de kkurosaki  
Fecha de Ingreso: junio-2011
Ubicación: Bleach (Colima, México)
Mensajes: 3
Antigüedad: 5 años, 11 meses
Puntos: 0
Respuesta: 2 bordes de 2 colores distintos en un mismo DIV

Quiero golpear a Obama
Ya dejense de lios tios...

@Kseso! es un buen posteador, ha ayudado a mucha gente, con el simple hecho de saberlo, pudieses haber puesto el codigo que te pedia, para que te hubiese dado una respuesta concreta, pero en fin....

El ya no va a participar aqui y tu @rulzzz, perfectamente haz mencionado que ya esta resuelto tu problema, estonces no hay razón para que tu también estes replicando aqui.

Ya dejense de berrinches y sigamos, que hay más usuarios a los cuales podemos ayudar.

Etiquetas: bordes, colores, distintos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:58.