Foros del Web » Creando para Internet » Diseño web »

Fireworks me alinea a la izquierda exportando a CSS DIV

Estas en el tema de Fireworks me alinea a la izquierda exportando a CSS DIV en el foro de Diseño web en Foros del Web. Hola que tal, tengo el fireworks CS4 y como ando apurado, he diseñado la página en aquél y lo estoy exportando bajo la opción CSS ...
  #1 (permalink)  
Antiguo 10/12/2009, 14:15
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Fireworks me alinea a la izquierda exportando a CSS DIV

Hola que tal, tengo el fireworks CS4 y como ando apurado, he diseñado la página en aquél y lo estoy exportando bajo la opción CSS DIV el cual me genera DIVS y CSS, ademas del archivo html o php y las imagenes en una carpeta lo que me parece un ahorro de tiempo considerable :D.

El problema es que cuando ya he exportado, noto que las divisiones tienen posicion absoluta con las ubicaciones ya definidas, y lo alinea todo a la izquierda al ver la pagina, me gustaria saber si existe una opcion para alinear al centro aun sabiendo que los divs tienen posiciones absolutas, y si esa solución tiene que ser desde fireworks o desde dreamweaver manipulando directamente el CSS generado. gracias.
  #2 (permalink)  
Antiguo 10/12/2009, 19:04
 
Fecha de Ingreso: julio-2005
Mensajes: 304
Antigüedad: 19 años, 4 meses
Puntos: 4
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

introducelo todo en un div y que sea este el que se centre en pantalla.
  #3 (permalink)  
Antiguo 11/12/2009, 12:06
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

Hola, muchas gracias por responder, lamentablemente no funciona :(, he puesto una etiqueta div contenedor al inicio despues de <body> y cierro antes de </body> y no habia resultados, entonces lo que hice fue agregar la regla background-color y algo de texto al div para darme cuenta de su posición.

La posición que toma es de solo una linea y en la parte de arriba todavia, o sea a pesar de poner las divs conteniendo a todas las demas divs, no contiene a ninguna voy a poner el css y el html
  #4 (permalink)  
Antiguo 11/12/2009, 12:07
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

Este es el HTML:

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" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SctrCrstInt</title>
<link rel="stylesheet" type="text/css" href="./SctrCrstInt.css" media="all" />
<!--[if IE]>
<style type="text/css" media="all">.borderitem {border-style:solid;}</style>
<![endif]-->
</head>

<body>

<div id="contenedor">

<div id="Div">
</div>
<div id="Div2">
</div>
<div id="Div3">
</div>
<div id="Div4">
</div>
<div id="Div5">
</div>
<div id="Div6">
</div>
<div id="Div7">
</div>
<div id="Div8">
</div>
<div id="Div9">
</div>
<div id="Div10">
</div>
<div id="Div11">
</div>
<div id="Div12">
</div>
<div id="Div13">
</div>
<img src="../Ext/Img/SctrCrstInt_r2_c4.jpg" id="SctrCrstInt_r2_c4"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r4_c2.jpg" id="SctrCrstInt_r4_c2"  alt="" />
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r6_c4.jpg" id="SctrCrstInt_r6_c4"  alt="" />
	</a>
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r6_c7.jpg" id="SctrCrstInt_r6_c7"  alt="" />
	</a>
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r6_c10.jpg" id="SctrCrstInt_r6_c10"  alt="" />
	</a>
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r6_c13.jpg" id="SctrCrstInt_r6_c13"  alt="" />
	</a>
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r6_c19.jpg" id="SctrCrstInt_r6_c19"  alt="" />
	</a>
<img src="../Ext/Img/SctrCrstInt_r8_c3.jpg" id="SctrCrstInt_r8_c3"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r8_c5.jpg" id="SctrCrstInt_r8_c5"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r8_c14.jpg" id="SctrCrstInt_r8_c14"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r9_c16.jpg" id="SctrCrstInt_r9_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r9_c17.jpg" id="SctrCrstInt_r9_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r9_c20.jpg" id="SctrCrstInt_r9_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r10_c3.jpg" id="SctrCrstInt_r10_c3"  alt="" />
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r10_c5.jpg" id="SctrCrstInt_r10_c5"  alt="" />
	</a>
<a href="algunapagina.php">
	<img src="../Ext/Img/SctrCrstInt_r10_c8.jpg" id="SctrCrstInt_r10_c8"  alt="" />
	</a>
<a href="algunsitio.php">
	<img src="../Ext/Img/SctrCrstInt_r10_c11.jpg" id="SctrCrstInt_r10_c11"  alt="" />
	</a>
<img src="../Ext/Img/SctrCrstInt_r10_c14.jpg" id="SctrCrstInt_r10_c14"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r11_c16.jpg" id="SctrCrstInt_r11_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r11_c20.jpg" id="SctrCrstInt_r11_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r13_c16.jpg" id="SctrCrstInt_r13_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r13_c17.jpg" id="SctrCrstInt_r13_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r13_c20.jpg" id="SctrCrstInt_r13_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r15_c16.jpg" id="SctrCrstInt_r15_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r15_c17.jpg" id="SctrCrstInt_r15_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r15_c20.jpg" id="SctrCrstInt_r15_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r16_c16.jpg" id="SctrCrstInt_r16_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r16_c20.jpg" id="SctrCrstInt_r16_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r17_c16.jpg" id="SctrCrstInt_r17_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r17_c17.jpg" id="SctrCrstInt_r17_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r17_c20.jpg" id="SctrCrstInt_r17_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r19_c16.jpg" id="SctrCrstInt_r19_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r19_c17.jpg" id="SctrCrstInt_r19_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r19_c20.jpg" id="SctrCrstInt_r19_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r20_c16.jpg" id="SctrCrstInt_r20_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r20_c20.jpg" id="SctrCrstInt_r20_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r21_c3.jpg" id="SctrCrstInt_r21_c3"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r21_c5.jpg" id="SctrCrstInt_r21_c5"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r21_c14.jpg" id="SctrCrstInt_r21_c14"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r22_c16.jpg" id="SctrCrstInt_r22_c16"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r22_c17.jpg" id="SctrCrstInt_r22_c17"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r22_c20.jpg" id="SctrCrstInt_r22_c20"  alt="" />
<img src="../Ext/Img/SctrCrstInt_r25_c1.jpg" id="SctrCrstInt_r25_c1"  alt="" />

</div>
</body>
</html>
  #5 (permalink)  
Antiguo 11/12/2009, 12:08
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

Y este es el CSS:

Código:
body {
	background-color: #ffffff;
	margin:0px;
	padding:0px;
	background-image: url(../Ext/Img/fondox.jpg);
	background-repeat: repeat;
	background-attachment: scroll;
}
.p {
	margin:0px;
	padding:0px;
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	text-align: inherit;
	color: inherit;
	line-height: inherit;
	vertical-align: top;
}
p {
	padding-top:0px;
	margin-top:0px;
}
img {
	border:0px;
}
div {
	margin:0px;
	padding:0px;
	font-family:verdana; font-size:12px;
}
.AbsWrap {
	width: 100%;
	position: relative;
}
.rowWrap {
	width: 100%;
}
.clearfloat {
	clear:both;
	height:0px;
}
a:link, a:visited{
	COLOR:inherit;
	text-decoration:inherit;
}

#contenedor
{
	width:1024px;
	background-color:#CC0;
	margin:0px auto;
}


#Div {
	background-color: #ffffff;
	border: 10px solid #6a83bb;
	width:209px;
	padding-top:0px;
	height:357px;
	position: absolute;
	left:698px;
	top:489px;
	margin-bottom:0px;

}
#Div2 {
	background-color: #ffffff;
	border: 10px solid #c0d41b;
	width:592px;
	padding-top:0px;
	height:864px;
	position: absolute;
	left:34px;
	top:489px;
	margin-bottom:0px;

}
#Div3 {
	width:203px;
	padding-top:0px;
	height:345px;
	position: absolute;
	left:705px;
	top:495px;
	margin-bottom:0px;

}
#Div4 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:240px;
	top:627px;
	margin-bottom:0px;

}
#Div5 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:435px;
	top:627px;
	margin-bottom:0px;

}
#Div6 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:45px;
	top:627px;
	margin-bottom:0px;

}
#Div7 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:435px;
	top:627px;
	margin-bottom:0px;

}
#Div8 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:240px;
	top:627px;
	margin-bottom:0px;

}
#Div9 {
	width:195px;
	padding-top:0px;
	height:724px;
	position: absolute;
	left:45px;
	top:627px;
	margin-bottom:0px;

}
#Div10 {
	background-color: #ffffff;
	border: 10px solid #ffff00;
	width:208px;
	padding-top:0px;
	height:209px;
	position: absolute;
	left:698px;
	top:897px;
	margin-bottom:0px;

}
#Div11 {
	width:203px;
	padding-top:0px;
	height:196px;
	position: absolute;
	left:705px;
	top:905px;
	margin-bottom:0px;

}
#Div12 {
	background-color: #ffffff;
	border: 10px solid #ec552f;
	width:208px;
	padding-top:0px;
	height:196px;
	position: absolute;
	left:698px;
	top:1157px;
	margin-bottom:0px;

}
#Div13 {
	width:203px;
	padding-top:0px;
	height:186px;
	position: absolute;
	left:705px;
	top:1163px;
	margin-bottom:0px;

}
#SctrCrstInt_r2_c4 {
	position: absolute;
	left:20px;
	top:22px;
	width:914px;
	height:106px;
	margin-bottom:0px;

}
#SctrCrstInt_r4_c2 {
	position: absolute;
	left:10px;
	top:134px;
	width:929px;
	height:264px;
	margin-bottom:0px;

}
#SctrCrstInt_r6_c4 {
	position: absolute;
	left:20px;
	top:405px;
	width:165px;
	height:48px;
	margin-bottom:0px;

}
#SctrCrstInt_r6_c7 {
	position: absolute;
	left:206px;
	top:405px;
	width:165px;
	height:48px;
	margin-bottom:0px;

}
#SctrCrstInt_r6_c10 {
	position: absolute;
	left:396px;
	top:405px;
	width:165px;
	height:48px;
	margin-bottom:0px;

}
#SctrCrstInt_r6_c13 {
	position: absolute;
	left:584px;
	top:405px;
	width:165px;
	height:48px;
	margin-bottom:0px;

}
#SctrCrstInt_r6_c19 {
	position: absolute;
	left:769px;
	top:405px;
	width:165px;
	height:48px;
	margin-bottom:0px;

}
#SctrCrstInt_r8_c3 {
	position: absolute;
	left:17px;
	top:470px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r8_c5 {
	position: absolute;
	left:45px;
	top:470px;
	width:585px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r8_c14 {
	position: absolute;
	left:630px;
	top:470px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r9_c16 {
	position: absolute;
	left:680px;
	top:471px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r9_c17 {
	position: absolute;
	left:708px;
	top:471px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r9_c20 {
	position: absolute;
	left:911px;
	top:471px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r10_c3 {
	position: absolute;
	left:17px;
	top:498px;
	width:28px;
	height:854px;
	margin-bottom:0px;

}
#SctrCrstInt_r10_c5 {
	position: absolute;
	left:45px;
	top:498px;
	width:195px;
	height:129px;
	margin-bottom:0px;

}
#SctrCrstInt_r10_c8 {
	position: absolute;
	left:240px;
	top:498px;
	width:195px;
	height:129px;
	margin-bottom:0px;

}
#SctrCrstInt_r10_c11 {
	position: absolute;
	left:435px;
	top:498px;
	width:195px;
	height:129px;
	margin-bottom:0px;

}
#SctrCrstInt_r10_c14 {
	position: absolute;
	left:630px;
	top:498px;
	width:28px;
	height:854px;
	margin-bottom:0px;

}
#SctrCrstInt_r11_c16 {
	position: absolute;
	left:680px;
	top:499px;
	width:28px;
	height:340px;
	margin-bottom:0px;

}
#SctrCrstInt_r11_c20 {
	position: absolute;
	left:911px;
	top:499px;
	width:28px;
	height:340px;
	margin-bottom:0px;

}
#SctrCrstInt_r13_c16 {
	position: absolute;
	left:680px;
	top:839px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r13_c17 {
	position: absolute;
	left:708px;
	top:839px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r13_c20 {
	position: absolute;
	left:911px;
	top:839px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r15_c16 {
	position: absolute;
	left:680px;
	top:879px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r15_c17 {
	position: absolute;
	left:708px;
	top:879px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r15_c20 {
	position: absolute;
	left:911px;
	top:879px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r16_c16 {
	position: absolute;
	left:680px;
	top:907px;
	width:28px;
	height:192px;
	margin-bottom:0px;

}
#SctrCrstInt_r16_c20 {
	position: absolute;
	left:911px;
	top:907px;
	width:28px;
	height:192px;
	margin-bottom:0px;

}
#SctrCrstInt_r17_c16 {
	position: absolute;
	left:680px;
	top:1099px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r17_c17 {
	position: absolute;
	left:708px;
	top:1099px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r17_c20 {
	position: absolute;
	left:911px;
	top:1099px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r19_c16 {
	position: absolute;
	left:680px;
	top:1139px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r19_c17 {
	position: absolute;
	left:708px;
	top:1139px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r19_c20 {
	position: absolute;
	left:911px;
	top:1139px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r20_c16 {
	position: absolute;
	left:680px;
	top:1167px;
	width:28px;
	height:187px;
	margin-bottom:0px;

}
#SctrCrstInt_r20_c20 {
	position: absolute;
	left:911px;
	top:1167px;
	width:28px;
	height:187px;
	margin-bottom:0px;

}
#SctrCrstInt_r21_c3 {
	position: absolute;
	left:17px;
	top:1352px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r21_c5 {
	position: absolute;
	left:45px;
	top:1352px;
	width:585px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r21_c14 {
	position: absolute;
	left:630px;
	top:1352px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r22_c16 {
	position: absolute;
	left:680px;
	top:1354px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r22_c17 {
	position: absolute;
	left:708px;
	top:1354px;
	width:203px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r22_c20 {
	position: absolute;
	left:911px;
	top:1354px;
	width:28px;
	height:28px;
	margin-bottom:0px;

}
#SctrCrstInt_r25_c1 {
	position: absolute;
	left:0px;
	top:1386px;
	width:950px;
	height:124px;
	margin-bottom:0px;

}
  #6 (permalink)  
Antiguo 16/12/2009, 11:50
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Solución a: Fireworks me alinea a la izquierda exportando a CSS DIV

Holaaaa, bueno ya descubrí la solución, para que nadie más se rompa la cabeza, pero quizás sea algo más compleja:

Fireworks CS4 es una buena herramienta, que te centra todo automáticamente sin necesidad de modificar código, lo único que hay que hacer es evitar solapamiento ("overlapping") si sucede esto, entonces fireworks para evitarse problemas y hacer que tú tengas la culpa jaja te dice que hay solapamiento y que las divisiones van a tomar posición absoluta.

En cambio si logran hacer un diseño muy bueno como sale en las recomendaciones de adobe TV (buscar en google), entonces te lo deja todo bonito como lo haz hecho.

Doy el tema solucionado. Muchos saludos
  #7 (permalink)  
Antiguo 16/12/2009, 12:32
 
Fecha de Ingreso: julio-2005
Mensajes: 304
Antigüedad: 19 años, 4 meses
Puntos: 4
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

más fácil, haz un posicionamiento relativo en el div contenedor, así el posicionamiento absoluto se hará respecto al div y no a la pantalla.
__________________
http://www.lynxstyle.net

En la vida como en el ajedrez, hay un reloj que marca el tiempo de cada movimiento, si lo consumes pierde (MJJG)
  #8 (permalink)  
Antiguo 27/12/2009, 21:41
Avatar de GabrielAngelos  
Fecha de Ingreso: septiembre-2008
Ubicación: Tacna
Mensajes: 36
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Fireworks me alinea a la izquierda exportando a CSS DIV

hola lynxstyle, gracias por tu consejo, pero al intentarlo no me funcionó , pero ya arreglé el diseño :D, de igual modo gracias por responder
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 04:35.