Ayuda para pasar este PSD a HTML CSS

B

Estoy comenzado con esto de pasar diseños a código y pese a que me he leído manuales no sé que me pasa que me cuesta muchísimo ver una diseño en Photoshop en modelo de cajas. Estoy bastante frustrado porque es lo más básico, ver una web dividida en bloques y veo que cada día que pasa no avanzo.

El template en cuestión es http://freepsd.com/2009/07/06/my-personal-blog-wordpress-themed-template/ y llevo una jodida mañana para hacer la puta cabecera.

Entonces, esto tal cual lo he pensado ha sido de la siguiente manera.

Jerarquía de DIVS.

"Contenido":

spoiler

"Cabecera":

spoiler

"Logo":

spoiler

Ahora el menú pues no sé como leñes ponerlo. Que me quede situado a la derecha. Que en cada imagen aparezca su texto correspondiente arriba...

Joder espero que no os de el coñazo y si tenéis tiempo haber si me podéis echar un cable.

Saludos y gracias de antemano

NeB1

Yo haría algo así:

#header{position:relative;DISPLAY:TABLE; y toda las cosas más que necesites como el background y tal.

el logo dentro del header y así:

#logo{float:left}

sin el absolute. los botones todos con float:right dentro del header

.botonHeader{float:right;}

Así el logo siempre estará a la izquierda y los botones a la derecha. Además le puedes dar margin-left y margin-right, y top y bottom para retocar un poco la posición.

B

Ok, ya lo he conseguido, gracias.

Pero ahora tengo otra cosa.

Las imágenes de los iconos sociales las tengo dentro del DIV de noticias pero no entiendo porque el degradado no se arrastra hasta ellas.

B

Me soluciono a mi mismo.

.noticia{
display: table
}

Si es una solución chapucera decírmelo eh!! xDD

NeB1

#4 yo hubiera hecho lo mismo ;)

Usuarios habituales