Entrar

No hay manera de poder poner los bordes en los DIVS

Ibalú · · Solicitar retirada
Buenos días a todos.
Pues aquí estoy sentadita frente a la pantalla, toda ilusionada e intentando poner los bordes de la lección... pero no, no hay manera, no encuentro el modo de que los bordes en negro se vean. Lo he intentado hasta el cansancio, desde revisar la hoja de estilos, hasta borrarlo todo y empezar desde cero y nada.
Algún alma caritativa que venga en mi auxilio?
Un abrazo

Ibalú
hq · · Solicitar retirada
Pues no se, a mi si que me sale, ¿puedes pegar el código a ver si hay algo raro?
Ibalú · · Solicitar retirada
Hola hq, gracias por responder.
Mira este es el código que está en la hoja de estilos:

BODY {BACKGROUND-COLOR: yellow ; }

#global {BACKGROUND-COLOR:#FF9900 ; BORDER: #000 1px solid ; }

#bartolo {BACKGROUND-COLOR:#00CC00 ; BORDER: #000 1px solid ; }

#catalina {BACKGROUND-COLOR:#00CCFF ; BORDER: #000 1px solid ; }

Y este otro está en el código html. de la página:


<HTML>

<HEAD>

<TITLE> El lado oscuro de la luna</TITLE>

<LINK rel="stylesheet" href="estilo.css" type="text/css" media="all">

</HEAD>

<BODY>

<DIV id="global">

<DIV id="bartolo">

Este es mi primer DIV llamado bartolo</P></DIV>

<DIV id="catalina">

Este es mi segundo DIV llamado catalina</P></DIV>

</DIV>

</BODY>

</HTML>

Hace un momento lo intenté de nuevo y nada, no me sale :(
Otra cosa, para ti o quien me la pueda contestar.
Yo tengo el dreamweaver 3.0, ¿hay algún problema por hacer mi página con el?

Un abrazo

Ibalú
hq · · Solicitar retirada
A mi si me sale, te comento:

1.- He copiado el código de la hoja de estilo en un archivo llamado "estilo.css"
2.- He copiado el código de la página en otro archivo con extensión "html"
3.- He ejecutado la página con 2 navegadores (Firefox e IE).
4.- En ambos navegadores sale un fondo amarillo y 2 recuadros, el de arriba verde y el de abajo azul, con el borde tal y como se describe en la hoja de estilos.

Conclusión:
Si no te sale, comprueba que la hoja de estilo sea accesible desde la página (si está en una subcarpeta, tendrás que indicarlo en el código).

En cuanto al Dreamweaver, por supuesto que puedes usarlo, la versión 3, la MX, la 8, la que quieras, al fin y al cabo es un producto para desarrollo de páginas web, eso si, cuanto más reciente sea la versión, más opciones tendrá, pero en el fondo son todas parecidas, dominando una se puede comprender y dominar el resto.

Espero haberte ayudado, saludos!!
Ibalú · · Solicitar retirada
Hola hq, te cuento
Yo estoy haciendo la pagina dentro del dreamweaver, ahora que vi tu respuesta, lo que hice fue abrir dos notepade, pegar los códigos ahi y guardar uno como estilos y otro como html, todo se ve lindo con sus bordes negros como me has dicho. Pero, pero, pero...... al pasarlo al dreamweaver se desaparecen los bordes. Conclusión: empecé a hacer las cosas mal, seguiré trabajando en una carpeta aparte y veré como va funcionando. Muchas gracias por tu ayuda.

Recibe un abrazo.

Ibalú
elcartel · · Solicitar retirada
Bueno amigos, a mi me pasa casi lo mismo pero con los márgenes, a ver quien me puede ayudar ya que no me salen:

Este es el código que tengo el la index.html

<HTML>
<HEAD>
<TITLE>La Pagina del Cartel</TITLE>
<LINK rel="stylesheet" href="estilo.css" type="text/css" media="all">
</HEAD>
<BODY>
<DIV id="global">
<DIV id="elcartel">

Este es el primer DIV creado por El Cartel</p></DIV>
<DIV id="lacartel">

Este es mi segundo DIV creado por mi</p></DIV>
</DIV>
</BODY>
</HTML>

Y este es el que coloque en la hoja de estilo.css

BODY {BACKGROUND-COLOR: yellow ; }
#global {BACKGROUND-COLOR:#FF9900 ; BORDER: #000 1px solid ; MARGIN: 12px 12px 12px 12px ;}
#diosman {BACKGROUND-COLOR:#00CC00 ; BORDER: #000 1px solid ; MARGIN: 0px 0px 0px 0px ;}
#chacon {BACKGROUND-COLOR:#00CCFF ; BORDER: #000 1px solid ; MARGIN: 0px 0px 0px 0px ;}

Disculpa Ibalú por colocar este post en el tuyo, pero como es casi parecido el problema que tenemos, puede ser que tu con el mío consigas solución al tuyo.......
elcartel · · Solicitar retirada
Ibalú escribió:Otra cosa, para ti o quien me la pueda contestar.
Yo tengo el dreamweaver 3.0, ¿hay algún problema por hacer mi página con el?

Ibalú
Creo que no!..... yo estoy usando el Dreamweaver MX y no e tenido ningún problema, de hecho las lecciones las e venido asiendo con este programa, así que no veo ningún problema.... solo que si es un poco complicado de seguir las lecciones cuando estas empezando ya que tiendes a confundirte....
Usuario 1064 · · Solicitar retirada
EL CARTEL:

He copiado y pegado tu codigo tal cual y a mi me ha funcionado.
A ver... el margin seria mas bien la posicion de la caja(div) y si te fijas, la caja(div) te la coloca a 12px en todos los lados.

si quieres q el texto tenga espacio, puedes probar con ponerle un padding:top right bottom left.

IBALIBU:
Seguramente tu problema sera devido a q no tienes bien escritas las rutas (como te ha comentado nuestro colega hq). ¿Tienes el html y el css en la misma carpeta?

CARPETA
html
css
elcartel · · Solicitar retirada
Gracias solidaria e cambia los parámetros de margin y poniendo el codigo PADDING: 2px 1px 2px 1px y e solucionado el problema, quedando mi pagina de estilo así:

BODY {BACKGROUND-COLOR: yellow ; TEXT-ALIGN:center ; }

#global {BACKGROUND-COLOR:#FF9900 ; BORDER: #000 1px solid ; MARGIN: 4px 4px 4px 4px ; PADDING: 2px 1px 2px 1px ; }

#diosman {BACKGROUND-COLOR:#00CC00 ; BORDER: #000 1px solid ; MARGIN: 0px 2px 0px 0px ; }

#chacon {BACKGROUND-COLOR:#00CCFF ; BORDER: #000 1px solid ; MARGIN: 0px 0px 0px 0px ; }

Lo de padding:top right bottom lef no lo e probado, pero me imagino que lo debería de reemplazar por el código que yo coloque.

Me podrías explicar eso?
Usuario 1064 · · Solicitar retirada
Lo de padding:top right bottom lef no lo e probado, pero me imagino que lo debería de reemplazar por el código que yo coloque.

jajajaj perdona, lo de padding:top right bottom left, era una forma de explicarme, lo que tu has puesto es lo correcto.

por ejemplo:

padding:40px 30px 20px 10px

lo q es igual a

40px espacio superior
30px espacio derecho
20px espacio inferior
10px espacio izquierdo

de todas formas recuerda que el padding es el espacio entre el borde y el contenido por lo que creo que te hace la tabla o div mas grande te suma esos valores a los que tienes como ancho y alto de la tabla width height.

yo lo que haria seria crear una clase de texto y le pondria su margin, osea su posicion respecto a su caja contenedor. ( no se si sera la forma mas correcta pero es la que yo uso)

por ejemplo mi div

#caja_div { width:500px; height:100px; background-color:red; margin:12px;}

.clase_texto {margin:12px; font-family:arial; color:blue;}

explicacion:
mi div tiene un tamaño de 500px y un alto de 100px, su margen respecto al navegador son 12px arriba, derecha, abajo, izquierda

mi texto tiene un margen respecto a su caja (contenedor) de 12px arriba, derecha, abajo, izquierda.


html

<div id="caja_div"><p class="clase_texto"> santa rita rita lo que se da no se quita</p>
</div>
PiraTa037 · · Solicitar retirada
Bueno, les comento... ami me pasa igual qle pasoa el cartel pero noconsigo solucionarlo. ya he copiado lso codigos q danen el curso y los he tratadode hacer yo pero no funciona. Asitengo los codigos:

estilo.css:
BODY {BACKGROUND-COLOR: gold ;}

#global {BACKGROUND-COLOR: orange ; BORDER: #000 1px solid ; MARGIN: 4px 4px 4px 4px ; PADDING: 2px 1px 2px 1px ; }

#bartolo {BACKGROUND-COLOR: red ; BORDER: #000 1px solid ; MARGIN: 0px 0px 0px 0px ; }

#catalina {BACKGROUND-COLOR: maroon ; BORDER: #000 1px solid ; MARGIN: 0px 0px 0px 0px ; }

index.htlm:
<HTML>

<HEAD>
<link rel="StyleSheet" href="estilo.css" media="screen" type="text/css">
<TITLE>L2Viper</TITLE>
</HEAD>

<BODY>
<DIV id="gloval">
<DIV id="bartolo">

Este es mi primer DIV llamado bartolo</P></DIV>
<DIV id="catalina">

Este es mi segundo DIV llamado catalina</P></DIV>
<DIV/>


</BODY>

</HTML>

Poravosr ayuda! . Gracias
PiraTa037 · · Solicitar retirada
Perdonen!!!....fue otra estupides mia...por q siempre me doy cuenta de mis erroresdespues de publicarlos en el foro... :( bueno lamento las molestias denuevo...
Gracias Y Perdon!!