trastenado acabo de solucionarlo, no cargaba la cache del mozilla bien entonces cuando realizo los cambios en Dreamweaver desde el icono vista previa/depurar navegador, pufff me tenia loco.

Aprovechando este post quisiera conseguir manteniendo esta estructura o diseño de css y html es cambiar indivudualmente el tamaño de los item.

<ul class="flex-container1">
	       <li class="item" id="item1"><img src="Foto yo/yo.jpg" " alt="50" width="85vw" height="50vh"><br><b>texto/ texto <dd> texto <dd> texto </b></li>
	       <li class="item" id="item2"><b><center><br> texto <br> texto <br> texto </b></center></li>                      
           <li class="item" id="item3">3</li> 
 
	       <li class="item" id="item4"><iframe width="330" height="190" src="Fotos.html" scrolling="no" frameborder="no"></iframe></li>
	       <li class="item" id="item5"><center><br><iframe width="50%" height="30%" src="Hoja1.html" scrolling="no" frameborder="no"></iframe></center></li>        
	       <li class="item" id="item6">6</li>
	       <li class="item" id="item7">7</li>
	       <li class="item" id="item8">8</li>
           <li class="item" id="item9">9</li>
           <li class="item" id="item10">10</li>
           <li class="item" id="item11">11</li>
           <li class="item" id="item12">12</li>
</ul> 
 

*{
	margin:0px;/*distaancia desde el alto de web este codigo no es original lo he puesto yo margin:80px;*/		
}
 
.flex-container1{	
    width:100%; /* width:90%; */
    max-width:auto; /* max-width:960px; */    
    list-style-type:none;
    margin:0px auto; /*  margin:20px auto; */
    padding:0;
    background-color:midnightblue; /*  background-color:midnightblue; */   
    /*Flexbox setup*/
    display:flex;
    flex-flow:row wrap;
    justify-content:center;/*poner los cuadros a la izquierda del padre justify-content: flex-start; centrado center;*/
	align-items:center; /*este codigo y el de abajo es para meter varios textos en el cuadro con <br> */ 
    align-content:stretch; /*este codigo y el de arriba es para meter varios textos en el cuadro con <br> */
}
.item{
    height:190px; /* altura cuadro height:210px; */
    width:330px; /*ancho width:290px; */
    line-height:20px; /*distancia en alto del contenido del cuadro 40px*/
    font-size:13px; /*tamaño del contenido del cuadro*/
    background-color:steelblue; /*color fondo cuadro background-color:steelblue*/
    color:#fff; /*color:#fff; contenido del cuadro*/
    text-align:center; /*ajustar a derecha izquierda o centro el contenido del cuadro left*/
    margin:2px 2px; /*25px distancia del ultimo item del cuadro de arriba 2px distancia de cuadros de al lado*/ 
}
 
/* ordenar posicion de item*/
#item1{
	order:1;
}
 
#item2{
	order:4;
}
 
#item3{
	order:5;
}
 
 
#item4{
	order:2;
} 
 
#item5{
	order:3;
} 
 
#item6{
	order:6;
}
 
#item7{
	order:7;
}
 
#item8{
	order:8;
}
 
 
#item9{
	order:9;
} 
 
#item10{
	order:10;
} 
 
#item11{
	order:11;
} 
 
#item12{
	order:12;
}

Salud2.

Hola buenas.

Tengo varios contenedores de class item, en uno de ellos tendo insertado un iframe de otra hoja html ahora trato de insertar otro iframe en otro item y no hay forma simplemente escribir <iframe></iframe> y se descuadra el resto de item ????

el que ya tengo insertado es:

<li class="item" id="item5"><center><br><iframe width="50%" height="30%" src="Hoja1.html" scrolling="no" frameborder="no"></iframe></center></li>
y cuando inserto lo mismo con otra de otra hoja pues lo dicho antes pufff

<li class="item" id="item3"><center><br><iframe width="50%" height="30%" src="Hoja2.html" scrolling="no" frameborder="no"></iframe></center></li>
Salud2.

Para lo que quiero ademas del post anterior tambien me puede servir lo siguiente.

Como trato de explicar el diseño consta de varios class="item" en contenedores para aplicarle diferentes medidas a cada contenedor ( ya que no se como hacerlo individual dentro del mismo contenedor)
para diferenciarlos en html y css estoy aplicando dentro de cada contenedor item,v-item y w-item

Y creo que  me puede valer usando el codigo ordenar siempre y cuando tambien pueda cambiar los tamaños de los item individualmente dentro de sus contenedores.

#item1{
	order:1;
}
 
#item2{
	order:5;
}
 
#item3{
	order:4;
}
 
 
#item4{
	order:3;
} 
 
 

pero nada por mas que trasteo no se como poner el codigo para ordenarlos, al tener diferentes item y contenedores

Saludosss.

bueno el container pue es el <ul class="flex-container1">y dentro de este estan varios item o sea <li class="item" ID="item3"> hay 1,2 y 3 ahora,hasta a qui lo entiendes ???
pues en este item3 tengo insertada una foto <img src="Foto eugenio/Eugenio.jpg" " alt="50" width="85vw" height="50vh"><br><iframe width="40%" height="30%" src="Reservar.html" scrolling="no" frameborder="no"></iframe></li> y quiero insertar otra hoja html <iframe width="40%" height="30%" src="Reservar.html" scrolling="no" frameborder="no"></iframe></li>
pues esta hoja no la muestra muestra otra hoja html hoja fotos, hasta a qui lo entiendes ???

El diseño parte de a qui http://www.falconmasters.com/css/guia-flexbox-layouts

no se mas que explicar.

Saludosss.

Me tiene locoo…….

trato que en diferentes container con sus item meter hojas html ya creadas.

Este código en este item3 dentro de .flex-container1 tal cual el enlace de hoja html sale otra hoja  html y se deconfigura los enlaces del container2¿??

<ul class="flex-container1">
<li class="item" ID="item3"><img src="Foto eugenio/Eugenio.jpg" " alt="50" width="85vw" height="50vh"><br><iframe width="40%" height="30%" src="Reservar.html" scrolling="no" frameborder="no"></iframe></li>
 

.flex-container1{	
    width:100%; /* width:90%; */
    max-width:auto; /* max-width:960px; */    
    list-style-type:none;
    margin:0px auto; /*  margin:20px auto; */
    padding:0;
    background-color:midnightblue; /*  background-color:midnightblue; */   
    /*Flexbox setup*/
    display:flex;
    flex-flow:row wrap;
    justify-content:flex-start;;/*poner los cuadros a la izquierda del padre justify-content: flex-start; centrado center;*/
	align-items:center; /*este codigo y el de abajo es para meter varios textos en el cuadro con <br> */ 
    align-content:stretch; /*este codigo y el de arriba es para meter varios textos en el cuadro con <br> */
}
.item{
    height:160px; /* altura cuadro height:200px; */
    width:290px; /*ancho width:200px; */
    line-height:40px; /*distancia en alto del contenido del cuadro*/
    font-size:13px; /*tamaño del contenido del cuadro*/
    background-color:steelblue; /*color fondo cuadro background-color:steelblue*/
    color:#fff; /*color:#fff; contenido del cuadro*/
    text-align:left; /*ajustar a derecha izquierda o centro el contenido del cuadro*/
    margin:5px 2px; /*25px distancia del ultimo item del cuadro de arriba 2px distancia de cuadros de al lado*/ 
}
 

En esta otra configuracion si consigo lo que quiero,pero cuando lo coloco en el container1 no me va sale otra hoja html que ya esta en container 2 con otro v-item4 :

<ul class="flex-container2">
 <li class="v-item" ID="item5"><img src="Foto eugenio/Eugenio.jpg" " alt="50" width="85vw" height="50vh"><br><iframe width="40%" height="30%" src="Reservar.html" scrolling="no" frameborder="no"></iframe></li>
 

.flex-container2{	
    width:100%; /* width:90%; */
    max-width:auto; /* max-width:960px; */    
    list-style-type:none;
    margin:0px auto; /*  margin:20px auto; */
    padding:0;
    background-color:midnightblue; /*  background-color:midnightblue; */   
    /*Flexbox setup*/
    display:flex;
    flex-flow:row wrap;
    justify-content:center;/*poner los cuadros a la izquierda del padre justify-content: flex-start;*/
}
.v-item{
    height:260px; /*  height:200px; */
    width:380px; /* width:200px; */
    line-height:200px; /*distancia en alto del contenido del cuadro*/
    font-size:20px;
    background-color:steelblue;/*color fondo cuadro background-color:steelblue*/
    color:#fff; /*color:#fff; contenido del cuadro*/
    text-align:center;/*ajustar a derecha izquierda o centro el contenido del cuadro*/
    margin:5px 2px;  /*25px distancia del ultimo item del cuadro de arriba 2px distancia de cuadros de al lado*/ 
}
 
.flex-container3{	
    width:100%; /* width:90%; */
    max-width:auto; /* max-width:960px; */    
    list-style-type:none;
    margin:0px auto; /*  margin:20px auto; */
    padding:0;
    background-color:midnightblue; /*  background-color:midnightblue; */   
    /*Flexbox setup*/
    display:flex;
    flex-flow:row wrap;
    justify-content:center;/*poner los cuadros a la izquierda del padre justify-content: flex-start;*/
}
 

 Bueno y aprovecho de paso como puedo cambiar individualmente los  tamaños de los cuadros de los container ¿?????


Salud2.

Hola buenas.

Como puedo hacer de estos cuatro div box1 y 2 estan en la msima posicion de altura uno a derecha y otro a izquierda al igual que box3 y 4, que al cambiar de tamaño de pantalla de mas a menos,llega un momento que se montan encima unio de otro y es hacer que el div box2 se coloque debajo de box1 igualmente box3 debajo del 4


Saludoss.

alguna ayuda por fa ???

Saludosss.

Hola.

Estoy intentando en una misma hoja de web meter todo lo que ya tengo en una web en v arias hojas.

En el primer paso tengo ya el Slidesow y correo y llamar, pero el problema que tengo es que el vertical vista movil ok, pero al poner en pc la pantalla completa el Slideshow ok pero el correo y llamadas no se ven, dejo la configuracion de slideshow y del correo y llamadas.
slideshow:

* {
	margin:0;
	padding:0;
}
 
.main {
	position:absolute;
    top:120;  /* Altura de distancia de cabecera de la presentacion de Fotos*/
	position:center;
	left:12px;
     /* Distancia de foto a la izquierda de la web  right:0,5vw;*/
    width:auto;	
}
 
.slides { /* slides es el contenedor de Fotos*/    
	width:90vw; /* Div Ancho de la presentacion de Fotos 100vw*/
	height:100vh; /* Div Alto de la presentacion de Fotos desde texto de arriba 100vh*/
}
 /* Div Fotos que estan dentro*/ 
.slides img {	
	width:90vw; /* Para ver Horizontal Ancho de la presentacion de Fotos 85vw*/	
	height:100%;/* Para ver Horizontal Alto de la presentacion de Fotos 100% */	
}
/* Div Fotos la parte del menu que numera las Fotos */
.slidesjs-pagination {	
	background:#424242;
	list-style:none;
	overflow:hidden;
}
/* Div Fotos la parte del menu que numera las Fotos los botones */ 
.slidesjs-pagination li {
	 float:left; 
 
}
 
.slidesjs-pagination li a {
	display:block;
	padding:6px 3px; /* Tamaño de los botones numerados de las fotos 8px 12px */
	color:#fff;
	text-decoration:none;
}
 
.slidesjs-pagination li a:hover {
	background:#FFF; /* Color fondo de los botones numerados de las fotos */ 
}
 
.slides .active {
	background:#000; /* Color fondo de los botones numerados de las fotos */
}
/* Debajo es a los botones de next Previous */ 
.slidesjs-navigation{
	background:#000;
	color:#fff;
	text-decoration:none;
	display:inline-block;
	padding:6px 10px; /* Tamaño caja negra de los botones de Siguiente y Atras 8px 15px */	
	float:right;
}
 
 

correo y llamadas:

*{ /*DIV PARA CORREO */
	margin:0px;
	padding:0px;	
}
 
div#correo{ /*DIV PARA CORREO */
	position:absolute;
    top:350; /* Distancia de CABECERA */ 
	margin-top:auto; 
	background:#f90;  /* Color Fondo icono background:#f90*/   
	left:5vw;
    width:auto;
	height:auto;		
	font-family:tahoma;	
	font-size:70px; /* Tamaño Icono*/
}
 
div#correo ul{
	list-style:none;
}
 
.icon-mail:before {
  content: "\900";
}
 
/* Div solo llamadas*/
*{
	margin:0px;
	padding:0px;	
}
 
div#llamadas{	/* Div solo llamadas*/
	position:absolute;
	top:350px;  /* Distancia de cabecera*/
	margin-top:auto; 
	background:#F90;  /* Color Fondo icono*/
    left:67vw;
    width:auto;	
	height:auto;	
	font-family:tahoma;	
	font-size:25px;	 /* Tamaño icono*/
}
 
.icon-phone:before {
  content: "\e901";
}
 

Saludosss.

En mi web puesto asi es, pero en la web de Disqus ??? a mi no me sale en español???

Saludosss.

bueno de momento me conformare con Disqus que lo conozco un poco, pero si alguno mejor y que no este su web en ingles mejor.

Saludoss.