Duda con css

Kr4n3oK

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

GreyShock

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 :P

Meleagant

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.

2 respuestas
Kr4n3oK

#3 Gracias, me imaginaba que ese era el problema.
Saludos

GreyShock

#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.

2 respuestas
Kr4n3oK

#5 Y el wrapper que llevaría, como funcionaría, me refiero a código y tal.
Una ayudita :D

1 respuesta
GreyShock

#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 :P

1 respuesta
Kr4n3oK

#7 Esta es, no está colgada:

Todavía tengo que liarme con los botones y tal xd
Es un poco cutre no? xdd

GreyShock

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 :P

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/

1 respuesta
Kr4n3oK

#9 Que va, le puse un titulo por poner algo xdd, la página la estoy creando para aprender jaja
#9 La verdad que de diseño voy bastante chungo si, como podría darle otro "toque"? XDD

3 respuestas
Meleagant

#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.

1 respuesta
BLZKZ

#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á.

1 respuesta
Kr4n3oK

#12 XDD, es una buena idea. xdd

Kr4n3oK

Así da otro aspecto, verdad?

Ahora cambio los colores base de la web y creo que podría salir algo fumable jajaja
#16 Gracias, jajaja xddd

1 respuesta
GreyShock

#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.

GreyShock

#14 Muchísimo mejor tío. Sigue sin ser una obra maestra, pero ya no duele a la vista xD

1 respuesta
lebroN

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

1 respuesta
Kr4n3oK

#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?

Kr4n3oK

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


Ya he redondeado bordes, well well

1 respuesta
GreyShock

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.

lebroN

#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? :P

1 respuesta
Kr4n3oK

#21 Si, con

border-radius:15px;
-moz-border-radius:15px;
-webkit-border-radius:15px;

Cada uno sirve para varios browser diferentes.

1 respuesta
GreyShock

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

2 respuestas
lebroN

#23 que se actualicen y sino que se coman todas las webs feas jajaja

Kr4n3oK

#23 Uno de esos parámetros es para IE creo. ahora te digo.
EDIT: No funcan en IE, grave error xd

1 respuesta
lebroN

#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>

Kr4n3oK

#25 El código esta bien? o falta algo? xht...al.dtd">

1 respuesta
GreyShock

Entra en el enlace y lo verás entero en la URL, mediavida lo acorta al detecarlo como un enlace... #27

EnZo

#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).

2 respuestas
Kr4n3oK

#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