Hola, estoy programando un CSS y tengo lo que creo que es un grave problema, algunas cajas no guardan la estructura de la página web cuando esta es scrolleada para mas grande o para mas pequeña.
¿A que se puede deber?, supongo que será el tipo de posicionamiento, pero es que creo no tener otra manera de guardar la estructura que tiene la web con otra forma de posicionamiento.
Un saludo
Ufff.. no he entendido prácticamente nada de lo que has dicho...
¿A qué te refieres por guardar la estructura de la página web? Al ancho? a la posición?
Más detalles, o captura o algo... si no, lo veo difícil
Si no quieres que la web cambie con el tamaño de la ventana, tendrás que posicionar todos los elementos de manera absoluta, con medidas concretas.
#3 Hombre... las posiciones absolutas no me parecen siempre la mejor opción. Creando un wrapper para el contenido de la web y metiendo dentro la estructura que deseas suele valer para que la web sea uniforme independientemente del tamaño del navegador, y es más flexible y fácil luego el desarrollo de la maquetación.
#6 Pues el wrapper sólo es un div con un ancho fijo centrado en la página:
<div id="wrapper">
...contenido de la página...
</div>
y en el css:
#wrapper{
width:800px /*por ejemplo*/
margin: 0 auto; /* para que esté centrado */
}
hecho eso, puedes meter lo que quieras dentro, con su estructura propia, y quedará contenido en ese wrapper (envoltorio).
De todas maneras, aquí tienes una explicación más extendida:
http://fb91.com.ar/blog/2010/01/05/centrar-un-sitio-horizontalmente-usando-css/
y un consejo: En versiones antiguas de Internet Explorer el wrapper no queda centrado con "margin:0 auto;", así que hay que ponerle al body{text-align:center;} para solucionarlo.
espero que te haya sido útil... está online la web que estás haciendo? por curiosidad
#7 Esta es, no está colgada:
Todavía tengo que liarme con los botones y tal xd
Es un poco cutre no? xdd
El diseño es horrible, parece un power point tío xDDD La estructura de la página no está mal, son sólo esas texturas raras que le dan un aspecto wordart extraño
Pues si le metes un tamaño fijo a la caja blanca que tienes como contenedor principal y la centras, hace las funciones de wrapper y te ahorras muchos problemas.
y.. permíteme preguntar... "TuBoda.es"? Es una web para generar invitaciones de boda y tal? Yo estuve metido en el desarrollo de un portal de bodas de estos (llamado yeswewant) y creo que acabaron pinchando.
estos tipos se los comieron con patatas: http://webboda.es/
#5 No me refiero a que posicione absolutamente todo, sino a que ponga la posición concreta y medidas concretas de los elementos que no quiere que cambien.
Por ejemplo, el ancho del wrapper, si no lo pone fijo, variará. Pues eso mismo.
#10 si te pasa lo que a mi, que tienes poco gusto para el diseño y que tampoco sabes usar demasiado bien ninguna herramienta de diseño hazlo lo más minimalista y simple que puedas, usando tonalidades claras (blancos, azules, grises...) asi al menos no será "fea" xD porque no podrá.
#10 Yo te recomendaría sencillamente que copiases diseños de otras páginas webs. Te diría "inspirarte", pero seamos claros, unos han nacido para diseñar y otros no xD
Un jefe que tuve que sabía mucho de diseño (y era muy bueno diseñando) una vez me dijo algo que tengo siempre en cuenta: En el mundo del diseño está todo inventado y perfeccionado hasta la saciedad, si no somos cracks del diseño ¿para qué reinventar la rueda? Fíjate en estilos de otras páginas y haz una mezcla o crea tu propia versión... lo que está claro es que de la manga no te vas a sacar ningún diseño que mejore todo lo que ha evolucionado el diseño hasta hoy. Así que no lo dudes y fíjate siempre en otras webs molonas antes de diseñar la tuya, y si hace falta, cálcalo.
#11 Por posiciones absolutas entendía "position:absolute", y tirando de eso constantemente se hace muy pesado y dificil de mantener cualquier site. Pero sí, está claro que algunos elementos de la web tienen que tener medidas fijas para darle consistencia al diseño.
Has probado a redondear los bordes de lo que es la caja contenedora principal? eso suele quedar bien. Te recomendo usar unos colores mas vivos, ya que los grises quedan un poco sosos, pero aun así el ultimo que has puesto esta mejor ;P
#17 Estuve probando a redondear los bordes de las cajas, pero no encontré los atributos de css que hagan eso, sabes por donde puedo buscarlos?
Ahí va los cambios, casi he conseguido que las cajas nos e muevan, de echo no se mueven a menos que metas un zoom de la ostia xd
Lo de redondear bordes yo lo hago con los estilos de los divs y poniendo imágenes png transparentes de fondo.. ya que el tema de redondeo mediante css no va fino fino en todos los navegadores, al menos según mi experiencia.
#19 Aqui te explican como se hace y varios ejemplos: http://www.css3.info/preview/rounded-border/
De todas formas creo que ya lo has conseguido no?
#21 Si, con
border-radius:15px;
-moz-border-radius:15px;
-webkit-border-radius:15px;
Cada uno sirve para varios browser diferentes.
Pero en IE8< no funciona.. y la mayoría de gente no ha llegado al 9 aún... la historia de siempre. Explorer es una mierda pero, hay que tenerlo en cuenta. #22 Aunque el tema de bordes redondeados.. supongo que los usuarios de explorer se pueden joder y punto no? que vean la web un poco más fea y yasta xD
#23 Uno de esos parámetros es para IE creo. ahora te digo.
EDIT: No funcan en IE, grave error xd
#25 prueba añadiendo en el header arriba del todo este codigo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
A mi antes no me iba en ie pero al poner eso se soluciono y funciona en todos xD a ver si tienes la misma suerte que yo!
edit: tiene que ir antes del <html>
Entra en el enlace y lo verás entero en la URL, mediavida lo acorta al detecarlo como un enlace... #27
#10 En cuanto al tema del diseño, porque lo otro ya lo tienes solucionado. Es un poco lo que dice GreyShock que parece un tio sabio xD
El diseño intenta copiar o inspirarte en algo. Yo uso mucho templatemonster.com para coger ideas de webs corporativas. Para que te hagas una idea. Yo he hecho http://www.jesusplanes.com/ y para hacerla me pase mucho tiempo mirando en templatemonster y me semi copíe de esta: http://www.templatemonster.com/website-templates/23084.html
El truco es saber manejar photoshop lo suficiente como para poder calcar una de esas webs. Una vez que sepas usar photoshop a ese nivel entonces usa templatemonster para coger un poco de aqui y otro poco de hayá.
Tu diseño es un poco horrible sip xD y me juego el cuello a que no la has empezao a diseñar en photoshop, si no que la diseñabas al mismo tiempo que la maquetabas en html xD
Eso hacia yo antes y me salian esos churros xD (Sin animo de ofender).
#29 No no, si esta bien que me lo digas xDD, es verdad, he estado mirando muchas tutos y tal, y lo primero es crear la web en fotoshop y luego ya maqutar xdd