Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje17-11-2010, 18:27 (UTC)    
Título del mensaje: Ayuda con los div !!

Hola gente del foro

Quiero hacer la pagina con divs pero no soy capaz de realizarlo o sea , se como se crean los div.

Código:
<div id="-----">
</div>


O algo asi y luego añadir el
Código:
 #-----


pero esto no es mi pregunta mi pregunta es como posicionar los div que e creado yo.

Un Saludo!
Mensaje17-11-2010, 21:27 (UTC)    
Título del mensaje:

para comodar manualmente un div hay que tener un poco de conocimiento sobre margenes (margin), margenes internos (padding) y desplazamientos {align}, ya que mayormente estos junto con otros especiales (float,clear,position) son los que mueven los div's

margin
mueve los contenedores desde afuera, esa es la razon de que si das al margen derecho e izquierdo el valor de automatico (margin-left:auto;margin-right:auto;) este contenedor se quedara flotando al centro

padding
mueve el contenido del div (si hay texto o imagenes dentro de tu div, este los movera), con este es con el que se le da separacion al texto

align (left.right. top, bottom)
segun mi experiencia, estos no funcionan a menos que se le de al contenedor el atributo de posicion absouta (position: absolute;) si no se hace esto, el div no se movera

todo esto se hace desde la hoja de estilos (aqui en pwg desde css sin styletags o desde el codigo de <style>)

espero esta informacion te sirva de algo
paginas que le pueden interesar
http://www.w3schools.com/
http://www.paginawebgratis.es/forum/viewtopic.php?t=16549
http://www.paginawebgratis.es/forum/viewtopic.php?t=29106
______________


Ultima edición por darknet13 el Mie Nov 17, 2010 5:31 pm; editado 1 vez
Mensaje17-11-2010, 21:59 (UTC)    
Título del mensaje:

claro, tambien recuerda que deves juntar aveses las id(#) con las class(.) para hacer una plantilla mejor
Código:
<div id="algo" class"otro">

Cita:
div.algo{} edita todos los divs con .algo

Cita:
.algo edita todo los .algo


tambien recuerda, que para que sea mas facil , deves de posicionar los divs unos entre otros, (y por cada div, hacerlos para la derecha para no confundir)
Código:
<div>
  <div>
      <div>
        algo
      </div>
  </div>
</div>

______________
/* Programador web freelance. */
/* twitter: @jfdelarosa */
Mensaje17-11-2010, 22:11 (UTC)    
Título del mensaje: mira os explico mi problema para k lo veais.

Mira a continuación os dejo los div para que veais que se "algo" de esto de los div.

Es que los quiero adaptar aquí porque este servicio me va muy bien para poner comentarios y el formulario de contacto xd.

Esto es lo que va en el css

Código:
body {
   background-color: white;
}
#wrapper {
   width: 1000px;
   height: 1200px;
   background-color: grey;
   margin-left: auto;
   margin-right: auto;
}
#wrapper #header {
      width: 1000px;
      height: 100px;
      background-color: red;
}
#wrapper #menu {
      width: 1000px;
      height: 30px;
      background-color: white;
}   
#wrapper #sidebar {
      width: 250px;
      height: 1040px;
      background-color:orange;
      margin-left: autopx;
      margin-right: auto;
}


El

Código:
body {
   background-color: white;


Le da el color a todo hasta ahy llego.

El #wrapper es lo que seria el #content_container de aquí creo?
y esto son los <div>

Código:
<div id="wrapper">
<div id="header">
Header
</div><!--header-->
<div id="menu">
menu2
</div><!--menu-->
<div id="sidebar">
<embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="540" height="405" name="chat" FlashVars="id=122011397" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /><br><small></small><br>
</div ><!--sidebar>
</div><!--wrapper-->


Mi pregunta en general aquí es

¿Como puedo crear los div en PWG ?
Mensaje17-11-2010, 22:46 (UTC)    
Título del mensaje:

intente esto
en esta zona en vez de estos 2
Cita:
#wrapper #sidebar {
width: 250px;
height: 1040px;
background-color:orange;
margin-left: autopx;
margin-right: auto;

}

utilize este
Cita:
float: left;

asi el sidebar se ira directo a la izquierda y el ultimo div del wrapper pongalo en texto por debajo de la pagina

solo faltaria eliminar los div automaticos del diseño css
Cita:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}


tambien le recomiendo que lo que vaya a meter al sidebar, este seguro de qe entra ya que usted puso un chat que no entra y sobrepasa las medidas
______________
Mensaje18-11-2010, 08:40 (UTC)    
Título del mensaje: no puedo...

No so y capaz,, el sidebar no se pone en su sitio

Encima de la pagina


Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http:/www.w3.org/1999/xhtml">
<div style="width:1000px; position: relative; margin-right: auto; margin-right: auto;">
<div id="sidebar">
Hola
</div >


Por debajo de la pagina

Código:
</div >


En CSS-Syn Style Taggs lo tengo así

Código:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
body {
   background-color: white;
}
#content_container{
   width: 1000px;
   height: 1400px;
   background-color: grey;
        margin-top:auto px;
}
#sidebar {
      width: 250px;
      height: 1400px;
      background-color:orange;
      float: left;
}


Ultima edición por basquet92 el Jue Nov 18, 2010 4:42 am; editado 3 veces
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group