Posición con div

[Wilfred]

MI problema es que tengo un div que no se inserta en el otro div.

Código:

  <div id="principal">
    <p align="center" class="Estilo2 Estilo12">[Home]</p>
    

    
   
    <div id="principal2"><?php include('list-noticia.php'); ?></div>

  
  </div>

el div de principal2 se debería ver en el de principal,pero se ve fuera...
si quito el estilo a list-noticia.php se ve como yo quiero....dentro de principal

Código:

 <div id="principal">
    <p align="center" class="Estilo2 Estilo12">[Home]</p>
    

    
   
  <?php include('list-noticia.php'); ?>

  
  </div>

si lo pongo de ese modo se ve dentro de principal...alguien sabe como hago para que el principal2 se vea dentro de principal?

gracias de antemano!

[daPhyre]

Podría ser por el código del include, o por algún estilo de estos Divs. ¿Podemos ver los códigos o un link para ver que es lo que está ocurriendo?

[Wilfred]

el código include sería este:

Código:

<?php

// verificamos si se ha enviado
// alguna variable via GET
if(isset($_GET['id']) && $_GET['categoria']){
    // asignamos los valores
    // a las variables que usaremos
    $cat_ID = $_GET['id'];
    $categoria = $_GET['categoria'];
    $clausula = "WHERE notCategoriaID = '$cat_ID'";
    // tambien armamos el titular de la pagina
    $titulo = "Noticias en la categoria $categoria";
}else{
    // de lo contrario
    // el titulo sera general
    $titulo = "Todas las noticias";
}
// armamos la consulta
  include('db-cnx.php');
$sqlQueryNot = mysql_query("SELECT *, notTitulo, notTexto,fecha,DATE_FORMAT(fecha,'%d-%m-%y ') AS fecha FROM sn_noticias ORDER BY not_ID DESC limit 3 
                            $clausula ", $db_link)
                            or die(mysql_error);
//echo "<h1>$titulo</h1>";
// mostramos las noticias,
// otra vez usanod un bucle while
while($rowNot = mysql_fetch_array($sqlQueryNot)){


    echo "<h1>$rowNot[notTitulo]</h1>";
	 echo substr($rowNot['notTexto'], 0, 500);
   
    echo "<center><br><a href=ver.php?id=$rowNot[not_id]>Seguir leyendo...</a><br></center>" ;
	
	echo "<span class='Estilo4'>Escrito el: </span><span class='Estilo5'>$rowNot[fecha]</span>";
	

	
}
?>

Después lo que pasa,mejor lo veis vosotros mismos.

El contenido se ve fuera del cuadrado rojo...ese es el problema

se debería ver así:

lo conseguí hacer quitándole el div al include...ya se que se que en verdad no hace falta darle estilo,lo que esto tan solo estoy probando por que quiero añadir una cosa dentro del cuadro rojo...pero no puedo.

[willyfc]

Hola Wilfred

Creo que mejor pones tu codigo css, sería bueno ver las propiedades de principal y principal2

[daPhyre]

Definitivamente, el error debe estar dentro del CSS por lo que veo.

Otro detalle: H1 debe ser solo el título principal de la página, te recomiendo que uses h2 mejor para los títulos de cada uno de los temas. Esperamos el código del CSS, suerte

[Wilfred]

Código:

@charset "utf-8";
/* CSS Document */

BODY {
    font: 8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align: center;
    background-color:#000000;
	color:#FFFFFF;
	font-weight:bold;
	
}
A:link {
color:#FF0000;
text-decoration:none;
}

A:hover {

color: blue;
cursor:crosshair;

}
A:visited {
color:#FF0000;
text-decoration:none;
}
 .linkmenu a:visited {
color:#FFFFFF;
}

.linkmenu a:link {
color:white;
}

.linkmenu a:active {
color:blue;
}


#contenedor{
    text-align: left;
    width: 595px;
    margin: auto;
	border: 1px solid #FF0000;
}
#cabecera{
    background-image:url(header.png);
    background-repeat:no-repeat;
	background-position:top;
    height:103px;
	width:auto;
}



#principal{
      text-align: left;
    width: 595px;
    margin: auto;
	border: 1px solid #FF0000;
	background-image:url(contenido.gif)
}

#izquierda{
      text-align: left;
    width: 200px;
    margin: auto;
	border: 1px solid #FF0000;
	background-image:url(contenido.gif)
}
#pie{
    background-color: #cccccc;
    padding: 3 10 3 10px;
    text-align:right;
    clear: both;
} 

#menu {
	 background-image:url(menu.png);
    background-repeat:no-repeat;
	background-position:center;
    height:30px;
	width:auto;

		 
} 
 #sidebar {
    width: 25px;
    padding: 10px;
    float: left;
    margin:auto;
}
#center {
width:75px;
float:right;
padding: 10px;
margin:auto;
text-align:left;
}
#principal2{
      
    width: 200px;
    
    float:left;
	position:inherit;
}



.Estilo1 {                          
	font-size: 12pt; 
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	color: #FFFFFF;
}

.Estilo2 {
	font-size: 24pt;
	color: #FF0000;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
}

.Estilo3 {
	font-size: 22pt;
	color: #FFFFFF;
	background-image:url(header-noticas.png);
	background-repeat:no-repeat;
	background-position:center;
	text-align:center;
}
.Estilo4 {
font-size:11px;
font-family:"Courier New", Courier, monospace;
font-style:italic;
color:#FFFFFF ;
}

.Estilo5 {
font-size:11px;
color:#FF0000;
}

h1 {
font-size: 22pt;
	color: #FFFFFF;
	background-image:url(header-noticas.png);
	background-repeat:no-repeat;
	background-position:center;
	text-align:center;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
}

h2 {
font:"Courier New", Courier, monospace;
color:#FFFFFF;
font-size:12px;


}
h3 {
font-size:20px;
font-family:"Courier New", Courier, monospace;
font-weight:bold;
}

ahí mi css :D

Gracias por la ayuda!

[willyfc]

queda fuera del cuadro rojo por que esta flotando a la izquierda, mmm....creo que mejor utilizas align="center" .

Puedes ver lo que hizo Mikmoro en el indice de Recursos

Bye.

[Wilfred]

Gracias,me sirvió perfecto.

[Wilfred]

me surgió otro problema,al hacerlo como tu dices siempre se quede en el centro aunque lo cambie por "right"....

Código:

#center {
width:400px;
float:right
align="right"
padding: 10px;
margin:auto;
text-align:left;
}

necesito que se alinea a la derecha para tener mi sidebar de una vez...xD

mira así es como se ve,a ver si alguien sabe como hacerlo...


Gracias de antemano

[willyfc]

hola Wilfred

primero te pido disculpas por no aclararte como colocar el código, no puedes utilizar align sobre el css, este se utiliza sobre el html a una etiqueta:

Código:

<div id="center" align="right">contenido</div>

pero bueno creo que este no será el caso, si te estoy entendiendo bien creo que es esto lo que quieres:

CSS

Código:

#contenedor{
text-align: left;
width: 595px;
height:auto;
display:table;
margin:0  auto;
border: 1px solid #FF0000;
}
#center {
width:400px;
float:right;
padding: 10px;
text-align:left;
height:auto;
}
#sidebar {
width: 25px;
padding: 10px;
float: left;
height:auto;
}

también una cosa importante que note en tu código es que te olvidas los ;(son necesarios en el css).

bueno espero haberte entendido bien y avisas si no te sirve para seguir trabajando...

sigo manteniendo varias del tu código original.

[Wilfred]

Ahora si,todo fue como la seda :D muchas gracias willyfc y a todo!
aquí os dejo la imagen:


Esto es lo que me da confianza para seguir adelante,vosotros xD!

[willyfc]

hola Wilfred

me alegra haberte ayudado, para eso estamos.

PD: te fijaste si tu pag. se ve igual en todos los navegadores? (incluyendo IE6).

Bye....