Joomla vs Dreamweaver

[MooDiE]

Cosas a corregir.

<.doctype html>coloca este doctype, es el nuevo de html5, fallara en algunas cosas, pero ya que estamos vamos a adaptarla a lo que viene.

Html>.

Head>.
/script> esta finalización de etiqueta no procede, ya que no hay un script que la abra.
title>e_pr_benetton</title>.
meta http-equiv=content-type content=text/html, charset=ISO-8859-1>.
link reel=styleshet href=.linkgranate, css type=text/css>.
script language=javascript>.
.- no es necesario que esté comentado, pero tampoco es malo.

Function m_reloadpage (init) { //reloads the window if nav4 resized.

If (init==true) with (Navigator) {if ((appname==Netscape)&&(parseint(appversion)==4)) {.

Document. M_pgw=innerwidth, document. M_pgh=innerheight, onresize=m_reloadpage; }}.

Else if (innerwidth.=document. M_pgw || innerheight.=document. M_pgh) location, reload().
}.

M_reloadpage (true).
// ->no es necesario que esté comentado, pero tampoco es malo.

Function m_findobj(n, d) { //v4.0.

Var, y,x, if(.d) d=document, if((p=n, indexof(? ))>0&&parent, frames, length) {.

D=parent, frames[n, substring(p+1)].document, n=n, substring(0, p),}.

If(.(x=d[n])&&d, all) x=d, all[n], for (i=0.x&&i<d, forms, length;i++) x=d, forms[i][n].

For(i=0.x&&d, layers&&i<d, layers, length;i++) x=m_findobj(n, d, layers[i].document).

If(.x && document, getelementbyid) x=document, getelementbyid(n), return x.
}.

Function m_showhidelayers() { //v3.0.

Var i, (*.obj), args=m_showhidelayers, arguments.

For (i=0, i<(args, length-2), i+=3) if ((obj=m_findobj(args[i])).=null) { v=args[i+2].

If (obj, style) { obj=obj, style, v=(v==show)? Visiblev=hide)? Hidden:v; }.

Obj, visibility=v; }.
}.
//->has cerrado el comentario antes, uno de los dos debe morir.
/script>.
link reel=styleshet href=.linea type=text/css>.
link reel=styleshet href=. Pr_01 type=text/css>.
link reel=styleshet href=. Pr_02 type=text/css>.
link reel=styleshet href=. Pr_03 type=text/css>.
link reel=styleshet href=. Pr_01_02 type=text/css>.
link reel=styleshet href=file:///e|/copia%20de%20copia%20de%2. Tegui_site.css type=text/css>.
link reel=styleshet href=. Alfcrouso type=text/css>.
link reel=styleshet href=barras, css type=text/css>.
link reel=styleshet href=. Pr_01_03 type=text/css>.
link reel=styleshet href=. Pr type=text/css>.
link reel=styleshet href=. Pr_03_01 type=text/css>.
link reel=styleshet href=. Pr_02_02 type=text/css>.
link reel=styleshet href=. Pr_01_04 type=text/css>.
link reel=styleshet href=. Pr_01_04 type=text/css>.
link reel=styleshet href=. Pr_01_05 type=text/css>.
link reel=styleshet href=. Pr_01_05 type=text/css>.
link reel=styleshet href=. Pr_03_03 type=text/css>.
link reel=styleshet href=. Pr_02_03 type=text/css>.
link reel=styleshet href=. Pr_01_b type=text/css>.
link reel=styleshet href=. Pr_01_b type=text/css>.
link reel=styleshet href=navegacion1.css type=text/css>.
link reel=styleshet href=navegacion1.css type=text/css>.
link reel=styleshet href=.pr_01_06 type=text/css>.
link reel=styleshet href=style, css type=text/css /> ojo, esta línea y la de abajo son iguales, ¿tenias algún fichero style, css creado antes? .
link reel=styleshet href=style, css type=text/css />.
style type=text/css>.

Pr_01_07 { color: #d4d0c8, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}.

Pr_01_07:hover { color: #509abe, text-decoration: none}.

Pr_01_08 { color: #509abe, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}.

Pr_01_08:hover { color: d4d0c8, text-decoration: none}.

Unnamed2 { color: #509abe}.

Navegacion3 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}.

Navegacion3:hover { text-decoration: none, color: d4d0c8}.

Pr_01_09 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}.

Pr_01_09:hover { color: #d4d0c8, text-decoration: none}.

Fotografías { font-family: arial, helvética, sans-serif, font-size: 75px, font-style: normal, color: #509abe, text-decoration: none}.

Fotografías:hover { color: #f, text-decoration: none}.

Más { font-family: arial, helvética, sans-serif, font-size: 12px, font-style: normal, color: #f, text-decoration: none}.

Más:hover { color: #666666, text-decoration: none}.

Ant { color: #666666, font-family: arial, helvética, sans-serif, font-size: 75px, text-decoration: none}.

Ant:hover { color: #f, text-decoration: none}.

Volver { font-family: arial, helvética, sans-serif, font-size: 14px, color: #509abe, text-decoration: none}.

Volver:hover { color: #c, text-decoration: none}.

Center-Layout {este código puede ir aquí o en el style, css, mejor que lo que vayamos haciendo vaya al fichero de estilos, así no nos liamos.
Width:869px.

Margin:0 auto.

Overflow: hidden.
//border:1px solid red.
}.
/style>.
link href=memoria, css reel=styleshet type=text/css>.
/head>.
link href=barras, css type=text/cs reel=styleshet>.
body bgcolor=#666666 text=#cccccc>el leguaje css se encarga del diseño de la web, poner css incrustado en html se debe evitar en la medida de lo posible, quita las dos instrucciones y pon lo que te escribo abajo en style, css.

Regla para el color del body:
Body {.

Background: #666; //es hexadecimal simplificado y significa lo mismo que #666666.

Color: #cccccc; //color para el texto del sitio.
}.

[Pit [reloaded]]

Ok menos esto: Obj, visibility=v; }
}
//->has cerrado el comentario antes, uno de los dos debe morir.
/script>.

Que no lo entiendo muy bien, si borro uno de los dos } me avisa de un error en el código.

[Pit [reloaded]]

Queda así:
.doctype html>
html>
head>
title>e_pr_benetton</title>
meta http-equiv=content-type content=text/html, charset=ISO-8859-1>
link reel=styleshet href=.linkgranate, css type=text/css>
script language=javascript>
.-
Function m_reloadpage (init) { //reloads the window if nav4 resized.

If (init==true) with (Navigator) {if ((appname==Netscape)&&(parseint(appversion)==4)) {
Document. M_pgw=innerwidth, document. M_pgh=innerheight, onresize=m_reloadpage; }}
Else if (innerwidth.=document. M_pgw || innerheight.=document. M_pgh) location, reload(),
}
M_reloadpage (true),
// ->
Function m_findobj(n, d) { //v4.0
Var, y,x, if(.d) d=document, if((p=n, indexof(? ))>0&&parent, frames, length) {
D=parent, frames[n, substring(p+1)].document, n=n, substring(0, p),}
If(.(x=d[n])&&d, all) x=d, all[n], for (i=0.x&&i<d, forms, length;i++) x=d, forms[i][n];
For(i=0.x&&d, layers&&i<d, layers, length;i++) x=m_findobj(n, d, layers[i].document),
If(.x && document, getelementbyid) x=document, getelementbyid(n), return x;
}
Function m_showhidelayers() { //v3.0
Var i, (*.obj), args=m_showhidelayers, arguments;
For (i=0, i<(args, length-2), i+=3) if ((obj=m_findobj(args[i])).=null) { v=args[i+2];
If (obj, style) { obj=obj, style, v=(v==show)? Visible v=hide)? Hidden:v; }
Obj, visibility=v; }
}
//->
/script>
link reel=styleshet href=.linea type=text/css>
link reel=styleshet href=. Pr_01 type=text/css>
link reel=styleshet href=. Pr_02 type=text/css>
link reel=styleshet href=. Pr_03 type=text/css>
link reel=styleshet href=. Pr_01_02 type=text/css>
link reel=styleshet href=file:///e|/copia%20de%20copia%20de%2...tegui_site.css type=text/css>
link reel=styleshet href=. Alfcrouso type=text/css>
link reel=styleshet href=barras, css type=text/css>
link reel=styleshet href=. Pr_01_03 type=text/css>
link reel=styleshet href=. Pr type=text/css>
link reel=styleshet href=. Pr_03_01 type=text/css>
link reel=styleshet href=. Pr_02_02 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_03_03 type=text/css>
link reel=styleshet href=. Pr_02_03 type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=.pr_01_06 type=text/css>
link reel=styleshet href=style, css type=text/css />
style type=text/css>
.-
. Pr_01_07 { color: #d4d0c8, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_07:hover { color: #509abe, text-decoration: none}
. Pr_01_08 { color: #509abe, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_08:hover { color: d4d0c8, text-decoration: none}
.unnamed2 { color: #509abe}
.navegacion3 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
.navegacion3:hover { text-decoration: none, color: d4d0c8}
. Pr_01_09 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
. Pr_01_09:hover { color: #d4d0c8, text-decoration: none}
.fotografías { font-family: arial, helvética, sans-serif, font-size: 75px, font-style: normal, color: #509abe, text-decoration: none}
.fotografías:hover { color: #f, text-decoration: none}
, más { font-family: arial, helvética, sans-serif, font-size: 12px, font-style: normal, color: #f, text-decoration: none}
, más:hover { color: #666666, text-decoration: none}
. Ant { color: #666666, font-family: arial, helvética, sans-serif, font-size: 75px, text-decoration: none}
. Ant:hover { color: #f, text-decoration: none}
.volver { font-family: arial, helvética, sans-serif, font-size: 14px, color: #509abe, text-decoration: none}
.volver:hover { color: #c, text-decoration: none}
/style>
/head>
link href=barras, css type=text/cs reel=styleshet>
body>.

[MooDiE]

<html>.

Head>.
/script>.
title>e_pr_benetton</title>.
meta http-equiv=content-type content=text/html, charset=ISO-8859-1>.
link reel=styleshet href=.linkgranate, css type=text/css>.
script language=javascript>.

Function m_reloadpage (init) { //reloads the window if nav4 resized.

If (init==true) with (Navigator) {if ((appname==Netscape)&&(parseint(appversion)==4)) {.

Document. M_pgw=innerwidth, document. M_pgh=innerheight, onresize=m_reloadpage; }}.

Else if (innerwidth.=document. M_pgw || innerheight.=document. M_pgh) location, reload().
}.

M_reloadpage (true).
// ->elimina solo esta linea.

Function m_findobj(n, d) { //v4.0.

Var, y,x, if(.d) d=document, if((p=n, indexof(? ))>0&&parent, frames, length) {.

D=parent, frames[n, substring(p+1)].document, n=n, substring(0, p),}.

If(.(x=d[n])&&d, all) x=d, all[n], for (i=0.x&&i<d, forms, length;i++) x=d, forms[i][n].

For(i=0.x&&d, layers&&i<d, layers, length;i++) x=m_findobj(n, d, layers[i].document).

If(.x && document, getelementbyid) x=document, getelementbyid(n), return x.
}.

Function m_showhidelayers() { //v3.0.

Var i, (*.obj), args=m_showhidelayers, arguments.

For (i=0, i<(args, length-2), i+=3) if ((obj=m_findobj(args[i])).=null) { v=args[i+2].

If (obj, style) { obj=obj, style, v=(v==show)? Visiblev=hide)? Hidden:v; }.

Obj, visibility=v; }.
}.
//->.
/script>.
link reel=styleshet href=.linea type=text/css>.
link reel=styleshet href=. Pr_01 type=text/css>.
link reel=styleshet href=. Pr_02 type=text/css>.
link reel=styleshet href=. Pr_03 type=text/css>.
link reel=styleshet href=. Pr_01_02 type=text/css>.
link reel=styleshet href=file:///e|/copia%20de%20copia%20de%2. Tegui_site.css type=text/css>.
link reel=styleshet href=. Alfcrouso type=text/css>.
link reel=styleshet href=barras, css type=text/css>.
link reel=styleshet href=. Pr_01_03 type=text/css>.
link reel=styleshet href=. Pr type=text/css>.
link reel=styleshet href=. Pr_03_01 type=text/css>.
link reel=styleshet href=. Pr_02_02 type=text/css>.
link reel=styleshet href=. Pr_01_04 type=text/css>.
link reel=styleshet href=. Pr_01_04 type=text/css>.
link reel=styleshet href=. Pr_01_05 type=text/css>.
link reel=styleshet href=. Pr_01_05 type=text/css>.
link reel=styleshet href=. Pr_03_03 type=text/css>.
link reel=styleshet href=. Pr_02_03 type=text/css>.
link reel=styleshet href=. Pr_01_b type=text/css>.
link reel=styleshet href=. Pr_01_b type=text/css>.
link reel=styleshet href=navegacion1.css type=text/css>.
link reel=styleshet href=navegacion1.css type=text/css>.
link reel=styleshet href=.pr_01_06 type=text/css>.
link reel=styleshet href=style, css type=text/css />.
link reel=styleshet href=style, css type=text/css />.
style type=text/css>.

Pr_01_07 { color: #d4d0c8, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}.

Pr_01_07:hover { color: #509abe, text-decoration: none}.

Pr_01_08 { color: #509abe, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}.

Pr_01_08:hover { color: d4d0c8, text-decoration: none}.

Unnamed2 { color: #509abe}.

Navegacion3 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}.

Navegacion3:hover { text-decoration: none, color: d4d0c8}.

Pr_01_09 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}.

Pr_01_09:hover { color: #d4d0c8, text-decoration: none}.

Fotografías { font-family: arial, helvética, sans-serif, font-size: 75px, font-style: normal, color: #509abe, text-decoration: none}.

Fotografías:hover { color: #f, text-decoration: none}.

Más { font-family: arial, helvética, sans-serif, font-size: 12px, font-style: normal, color: #f, text-decoration: none}.

Más:hover { color: #666666, text-decoration: none}.

Ant { color: #666666, font-family: arial, helvética, sans-serif, font-size: 75px, text-decoration: none}.

Ant:hover { color: #f, text-decoration: none}.

Volver { font-family: arial, helvética, sans-serif, font-size: 14px, color: #509abe, text-decoration: none}.

Volver:hover { color: #c, text-decoration: none}.

Center-Layout {.
Width:869px.

Margin:0 auto.

Overflow: hidden.
//border:1px solid red.
}.
/style>.
link href=memoria, css reel=styleshet type=text/css>.
/head>.
link href=barras, css type=text/cs reel=styleshet>.
body bgcolor=#666666 text=#cccccc>.

[Pit [reloaded]]

Tengo que quitar el doctype que me apuntaste para que no se me descojone la página. Ya quito la class incrustada en el body y usamos el.
link reel=styleshet href=style, css type=text/css /> queda así:
html>
head>
/script>
title>e_pr_benetton</title>
meta http-equiv=content-type content=text/html, charset=ISO-8859-1>
link reel=styleshet href=.linkgranate, css type=text/css>
script language=javascript>
.-
Function m_reloadpage (init) { //reloads the window if nav4 resized.

If (init==true) with (Navigator) {if ((appname==Netscape)&&(parseint(appversion)==4)) {
Document. M_pgw=innerwidth, document. M_pgh=innerheight, onresize=m_reloadpage; }}
Else if (innerwidth.=document. M_pgw || innerheight.=document. M_pgh) location, reload(),
}
M_reloadpage (true),
Function m_findobj(n, d) { //v4.0
Var, y,x, if(.d) d=document, if((p=n, indexof(? ))>0&&parent, frames, length) {
D=parent, frames[n, substring(p+1)].document, n=n, substring(0, p),}
If(.(x=d[n])&&d, all) x=d, all[n], for (i=0.x&&i<d, forms, length;i++) x=d, forms[i][n];
For(i=0.x&&d, layers&&i<d, layers, length;i++) x=m_findobj(n, d, layers[i].document),
If(.x && document, getelementbyid) x=document, getelementbyid(n), return x;
}
Function m_showhidelayers() { //v3.0
Var i, (*.obj), args=m_showhidelayers, arguments;
For (i=0, i<(args, length-2), i+=3) if ((obj=m_findobj(args[i])).=null) { v=args[i+2];
If (obj, style) { obj=obj, style, v=(v==show)? Visiblev=hide)? Hidden:v; }
Obj, visibility=v; }
}
//->
/script>
link reel=styleshet href=.linea type=text/css>
link reel=styleshet href=. Pr_01 type=text/css>
link reel=styleshet href=. Pr_02 type=text/css>
link reel=styleshet href=. Pr_03 type=text/css>
link reel=styleshet href=. Pr_01_02 type=text/css>
link reel=styleshet href=file:///e|/copia%20de%20copia%20de%2. Tegui_site.css type=text/css>
link reel=styleshet href=. Alfcrouso type=text/css>
link reel=styleshet href=barras, css type=text/css>
link reel=styleshet href=. Pr_01_03 type=text/css>
link reel=styleshet href=. Pr type=text/css>
link reel=styleshet href=. Pr_03_01 type=text/css>
link reel=styleshet href=. Pr_02_02 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_03_03 type=text/css>
link reel=styleshet href=. Pr_02_03 type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=.pr_01_06 type=text/css>
link reel=styleshet href=style, css type=text/css />
style type=text/css>
.-
. Pr_01_07 { color: #d4d0c8, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_07:hover { color: #509abe, text-decoration: none}
. Pr_01_08 { color: #509abe, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_08:hover { color: d4d0c8, text-decoration: none}
.unnamed2 { color: #509abe}
.navegacion3 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
.navegacion3:hover { text-decoration: none, color: d4d0c8}
. Pr_01_09 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
. Pr_01_09:hover { color: #d4d0c8, text-decoration: none}
.fotografías { font-family: arial, helvética, sans-serif, font-size: 75px, font-style: normal, color: #509abe, text-decoration: none}
.fotografías:hover { color: #f, text-decoration: none}
, más { font-family: arial, helvética, sans-serif, font-size: 12px, font-style: normal, color: #f, text-decoration: none}
, más:hover { color: #666666, text-decoration: none}
. Ant { color: #666666, font-family: arial, helvética, sans-serif, font-size: 75px, text-decoration: none}
. Ant:hover { color: #f, text-decoration: none}
.volver { font-family: arial, helvética, sans-serif, font-size: 14px, color: #509abe, text-decoration: none}
.volver:hover { color: #c, text-decoration: none}
/style>
link href=memoria, css reel=styleshet type=text/css>
/head>
link href=barras, css type=text/cs reel=styleshet>
body>.

[Kashir]

sí que avanzas, Pit. Os dejo lo que os comenté el otro día sobre CS y js para la compatibilidad con iExplorer y demás:
En el index.php:

.doctype html>.
link reel=styleshet href=css/reset, css />.
link reel=styleshet href=css/style, css />.
.-[if ie]> t<script src=js/html5.js type=text/javascript></script>.
.[endif]->.

archivo reset, css: http://pastebin.com/9xfsjsig.

Archivo html5.js: http://pastebin.com/ffxn8xla.
sin más.

Posdata: gracias por el pm Modie, ya se me olvidó que te lo había enviado.

[Pit [reloaded]]

Así la dejo: copio el script para maximizar la ventana.

Html>
head>
script language=javascript1.2>
.-
Window.moveto (0,0),
If (document, all) {
Top.window.resizeto (screen, availwidth, screen, availheight),
}
Else if (document, layers||document, getelementbyid) {
If (top.window.outerheight<screen, availheight||top.window.outerwidth<screen, availwidth){
Top.window.outerheight = screen, availheight;
Top.window.outerwidth = screen, availwidth;
}
}
//->
/script>
title>e_pr_benetton</title>
meta http-equiv=content-type content=text/html, charset=ISO-8859-1>
link reel=styleshet href=.linkgranate, css type=text/css>
script language=javascript>.
.-
Function m_reloadpage (init) { //reloads the window if nav4 resized.

If (init==true) with (Navigator) {if ((appname==Netscape)&&(parseint(appversion)==4)) {
Document. M_pgw=innerwidth, document. M_pgh=innerheight, onresize=m_reloadpage; }}
Else if (innerwidth.=document. M_pgw || innerheight.=document. M_pgh) location, reload(),
}
M_reloadpage (true),
// ->
Function m_findobj(n, d) { //v4.0
Var, y,x, if(.d) d=document, if((p=n, indexof(? ))>0&&parent, frames, length) {
D=parent, frames[n, substring(p+1)].document, n=n, substring(0, p),}
If(.(x=d[n])&&d, all) x=d, all[n], for (i=0.x&&i<d, forms, length;i++) x=d, forms[i][n];
For(i=0.x&&d, layers&&i<d, layers, length;i++) x=m_findobj(n, d, layers[i].document),
If(.x && document, getelementbyid) x=document, getelementbyid(n), return x;
}
Function m_showhidelayers() { //v3.0
Var i, (*.obj), args=m_showhidelayers, arguments;
For (i=0, i<(args, length-2), i+=3) if ((obj=m_findobj(args[i])).=null) { v=args[i+2];
If (obj, style) { obj=obj, style, v=(v==show)? Visible v=hide)? Hidden:v; }
Obj, visibility=v; }
}
//->
/script>
link reel=styleshet href=.linea type=text/css>
link reel=styleshet href=. Pr_01 type=text/css>
link reel=styleshet href=. Pr_02 type=text/css>
link reel=styleshet href=. Pr_03 type=text/css>
link reel=styleshet href=. Pr_01_02 type=text/css>
link reel=styleshet href=file:///e|/copia%20de%20copia%20de%2...tegui_site.css type=text/css>
link reel=styleshet href=. Alfcrouso type=text/css>
link reel=styleshet href=barras, css type=text/css>
link reel=styleshet href=. Pr_01_03 type=text/css>
link reel=styleshet href=. Pr type=text/css>
link reel=styleshet href=. Pr_03_01 type=text/css>
link reel=styleshet href=. Pr_02_02 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_04 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_01_05 type=text/css>
link reel=styleshet href=. Pr_03_03 type=text/css>
link reel=styleshet href=. Pr_02_03 type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=. Pr_01_b type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=navegacion1.css type=text/css>
link reel=styleshet href=.pr_01_06 type=text/css>
link reel=styleshet href=style, css type=text/css />
style type=text/css>
.-
. Pr_01_07 { color: #d4d0c8, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_07:hover { color: #509abe, text-decoration: none}
. Pr_01_08 { color: #509abe, text-decoration: none, font-family: arial, helvética, sans-serif, font-size: 14px}
. Pr_01_08:hover { color: d4d0c8, text-decoration: none}
.unnamed2 { color: #509abe}
.navegacion3 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
.navegacion3:hover { text-decoration: none, color: d4d0c8}
. Pr_01_09 { font-family: arial, helvética, sans-serif, font-size: 10px, color: #509abe, text-decoration: none}
. Pr_01_09:hover { color: #d4d0c8, text-decoration: none}
.fotografías { font-family: arial, helvética, sans-serif, font-size: 75px, font-style: normal, color: #509abe, text-decoration: none}
.fotografías:hover { color: #f, text-decoration: none}
, más { font-family: arial, helvética, sans-serif, font-size: 12px, font-style: normal, color: #f, text-decoration: none}
, más:hover { color: #666666, text-decoration: none}
. Ant { color: #666666, font-family: arial, helvética, sans-serif, font-size: 75px, text-decoration: none}
. Ant:hover { color: #f, text-decoration: none}
.volver { font-family: arial, helvética, sans-serif, font-size: 14px, color: #509abe, text-decoration: none}
.volver:hover { color: #c, text-decoration: none}
->
/style>
link href=memoria, css reel=styleshet type=text/css>
/head>
link href=barras, css type=text/cs reel=styleshet>
body>.

[Pit [reloaded]]

Gracias kashir miraré eso que has subido pronto a ver si lo entiendo por cierto, veo que pones el <.doctype html> que es el que sugería Modie si yo lo pongo en el código que he subido se me descojona la página.

[MooDiE]

Yo te recomendaría colocar el dtd aunque se descojone la web, y poco a poco vamos modificando lo que falle hasta que la web funcione correctamente.

Si puedes copiarme a partir de ahora también lo que continua después del body, quiero ver que hacen exactamente ese código javascript en la web y si se puede sustituir por algo más liviano y actual.

Lo que ha subido kashir, en primer lugar el reset, css es para poner todos lo valores por defecto a 0 (o algún valor predeterminado que se quiera) esto es porque cada navegador tiene algunas variaciones en su código por defecto, con este fichero se declaran todos los elementos a un valor inicial para que así no haya problemas y todos tengan los mismos valores iniciales para la web en cuestión.

Recursos sobre css:
-960 grid system http://960.gs/.

Blueprint css http://www.blueprintcss.org/.

En estas web encontraras recursos para el maquetado y desarrollo de mockups con Adobe Photoshop, Illustrator y otros programas de diseño. También hay códigos completos de css para comenzar con un sitio web, está el reset, css, otros sobre tipografías, en fin, ojealos y usa los que más te convengan en función de la web.

El segundo es un fichero de javascript que te permite hacer una especie de soporte para html5 en navegadores antiguos, realmente esto no es así, lo que crea es los nuevos elementos de html5 (section, article, aside,) y para los navegadores antiguos pues se comportarían como una div más (algunos elementos de html5 no son más que div con el nombre cambiado para hacerlos más identificativos). Pero este tipo de scripts solo sirven para que la web no se descojone totalmente en navegadores antiguos, pero seguirán teniendo carencias de funcionalidad con html5 que hay que solventar con otros scripts o que simplemente no se podrían soportar.

Ambos son útiles, yo solo coloco el reset, css en mis webs ya que no suelo usar los nuevos elementos de html5 como tales sino que creo capas comunes y a esas capas les asigno una clase o una id con el nombre de ese elemento de html5, ya es cuestión de gustos.

[Pit [reloaded]]

Yo te recomendaría colocar el dtd aunque se descojone la web, y poco a poco vamos modificando lo que falle hasta que la web funcione correctamente.

Ok yo hoy estoy intentando acabar el trabajo que entrego el martes, para poder centrarme en todo esto.

[Pit [reloaded]]

Hola tíos la verdad es que estoy avanzando mucho, estudiando de madrugada, y prefiero no hacer muchas preguntas puntuales, pero desde hace varias noches me asaltaba una duda si escribo algo así:
a href=mailto:contactar@foreromaldito, com><img src=assets/contacto_foreroignorante.jpg alt=enviar email title=enviar mail width=250 high=22 pulgadas align=left border=0 /></a> con la intención de que al hacer click se abra el outlook y mandar un mail, poniendo un contacto_foreroignorante.jpg en el que estuviesem escrita la dirección (contactar@foreromaldito.com), la intención sería evitar el correo basura, pero al estar la dirección en el código, no solucionamos nada.
¿Hay alguna forma de hacerlo despistando a los robots para evitar el correo basura?

[Pit [reloaded]]

En este foro hay una discusión con una solución aparentemente sencilla e ingeniosa. (http://www.forosdelweb.com/f85/como-...r-spam-685999/).

Proponen escribir el correo al revés y con css decirle que lo ponga al derecho.

Código CS.

Span, test { direction: rtl; unicode-bidi:bidi-override; }.

Código html.

P><span class=test>moc, tset@tset</span></p>.

Pero advierte de la coletilla: pasa CS 2.1 y xhtml 1.0 transitional que no sé a qué se refiere.
¿Esto podría funcionar y engañar a los robots?

[Pit [reloaded]]

¿Podría valer algo así?
.doctype html public -//w3c//dtd xhtml 1.0 transitional//en http://www.w3.org/tr/xhtml1/dtd/xhtm...siciónal, dtd>
html xmlns=http://www.w3.org/1999/xhtml>
head>
meta http-equiv=content-type content=text/html, charset=utf-8 />
title>documento sin título</title>
style type=text/css>
.forerotarado { direction: rtl; unicode-bidi:bidi-override; }
/style>
/head>
body>
p><a href=mailto:contactar@forerotarado, com><span class=forerotarado>moc, odaratorerof@ratcatnoc</span></a></p>
/body>
/html> pero entonces, los robots leerían el <a href=mailto:contactar@forerotarado, com>? Y el problema seguiría?

[MooDiE]

Eso es mejor con un formulario de contacto en php. Con eso consigues que el usuario final no llegue a ver jamás el correo electrónico. ¿cómo es esto? Pues no sé si te ha dado tiempo a leer cómo funcionan los lenguajes web, pero fundamentalmente existen desesperados:
Html.

Este es el lenguaje de etiquetas que usas, este lenguaje lo procesa el navegador por lo que el código se ve tal cual. Por eso podemos darle a botón derecho -> ver código fuente.

Cs.

Este lenguaje le dice al navegador como tiene que aplicarle estilos al html, el código viaja hasta el cliente, así que, esté también es capaz de verlo.

Javascript.

Este es igual que los anteriores los procesa el navegador web, incluso en las opciones de los navegadores puedes desactivarlo, por eso es sumamente importante que el funcionamiento de la web no dependa de javascript, sino que este sea una mera ayuda. Hay excepciones, claro, pero hay que evitarlo en la medida de lo posible. Nuevamente el código puede ser visto por el usuario final.

Php.

Para mí, estos lenguajes no son más que unos constructores de código (html en este caso) existen algunos otros como Ruby, Python, etc. Este lenguaje se ejecuta en el servidor web y genera un html en función de x condiciones, y es este html el que se envía al cliente. Por lo que todo aquel que no tenga acceso al servidor no podrá ver tu código fuente. Con lo que si generas un formulario que le envíe los datos que quieras a un fichero php en el servidor, este procesara la información y generara un correo electrónico que es el que se enviara al destino final. Quedando así la dirección de correo electrónico oculta para los usuario.

Luego es como todo tienes medidas del tipo captcha para evitar que una máquina haga spam desde este formulario. Todos sabemos lo que son los captchas, esas letras y números deformes, que no es más que un control de seguridad para evitar spams automatizados.

Tengo por ahí un código de muestra con un formulario web. En cuanto de con el te lo paso. No obstante si buscas por la red encontraras miles de tutoriales al respecto. Un saludo.

[Pit [reloaded]]

Gracias Modie de momento aún no he llegado al php estoy con el xhtml y el css, voy cogiendo soltura, llegaré al php.

[MooDiE]

Cuando quieras me avisas y te enseño como va el tema del php y formularios. Con tu formación y experiencia en infografía unido con la programación web vas a acabar haciendo unas webs de cuidado.

[Kashir]

para mí el factor más importante para hacer webs sugerentes es el Adobe Photoshop. La gente que no tiene mucha idea de web, pero tira bien de Photoshop deja unas webs bastante guapas.

Por cierto, yo suelo usar el formulario en php para contacto pero nunca he creado uno de 0, así que, cuando se lo enseñes a Pit me pasaré también con lápiz y cuaderno.
sin más.

[Pit [reloaded]]

Yo ya tengo preparado el lápiz y el cuaderno también.

[MooDiE]

Vale haré algo simple empezando desde cero así lo tendréis los dos, además me gustaría explicarlo todo paso a paso. Me llevara algún tiempo que ahora me pilláis liado.

Intentaré dividir el tutorial del formulario en 4 partes: html, CS, php, javascript.

En cuanto lo tenga os aviso, un saludo.

[Pit [reloaded]]

Te he dejado un mensaje en tu blog,. No sabía que lo tuyo eran las partículas. :9.

[Kashir]

te he dejado un mensaje en tu blog,. No sabía que lo tuyo eran las partículas. :9.

Las partículas, así como los fluidos y simulaciones, el VFX en sí, es lo que me llama la atención y espero que sea lo mío algún día (a nivel profesional digo).

Te respondo por el pm, gracias por el comentario.
sin más.

[Pit [reloaded]]

Me llevara algún tiempo que ahora me pilláis liado.

Tranquilo Modie, nosotros esperamos. Yo mientras me entretengo probando etiquetas xhtml:
.doctype html public -//w3c//dtd html 4.01 transitional//en http://www.w3.org/tr/html4/lose, dtd>
html>
head>
meta http-equiv=content-type content=text/html, charset=utf-8>
title>probando etiquetas xhtml hasta reventar</title>
/head>
body>
p>con estos síntomas, podría tratarse de un caso de <dfn title=obsesión por los foros de 3d>foreritis aguda 3desera</dfn>. Lo que nos lleva a la etiqueta cita:</p>
p>como dijo <cite>Pit Matson</cite>:
blockquote>dale caña al xhtml hasta que revientes.</blockquote>
/body>
/html>.

[MooDiE]

Vaya estás haciendo tus progresos, espero que algún día veamos un mensaje aquí para enfrentarnos a un pequeño reto de desarrollo web, lo mismo te digo.

[Pit [reloaded]]

Yo también lo espero de momento le voy dando caña mientras te esperamos con lo del mailto en php.

[Pit [reloaded]]

Vaya estás haciendo tus progresos, espero que algún día veamos un mensaje aquí para enfrentarnos a un pequeño reto de desarrollo web, lo mismo te digo.

Dame un mes más de estudio y os acepto el reto ahora mientras espero lo del mailto vía php de momento una cuestión, en una línea de código como ésta:
p><a href=index.html><span class=linknaranja>home</span></a> <a href=01.html><span class=linkgranate>pagina_01</span></a> <a href=02.html><span class=linknazul>pagina_02</span></a></p> el mero hecho de poner la etiqueta <span class> antes de la <a href> hace que no funcione el css como debiera por ejemplo, si cambio el orden en pagina_01.

P><a href=index.html><span class=linknaranja>home</span></a> <span class=linkgranate><a href=01.html>pagina_01</a></span> <a href=02.html><span class=linknazul>pagina_02</span></a></p> cambia y ya no funciona bien, y el enlace parece coger los valores por defecto.
¿Hay algún criterio para esas jerarquías u órdenes?

[MooDiE]

¿Hay algún criterio para esas jerarquías u órdenes?

Por supuesto, el nombre de CS (hojas de estilos en cascada) significa que los estilos se van heredando hasta llegar al último elemento.

Lo que quiere decir que si tienes las propiedades:
A {color: blue;}.

Linkred {color: red;}.

Entonces con estos códigos ocurrirá lo siguiente.

<a href=index.html><span class=linkred>home</span></a>.

Con este código home se mostrara en rojo puesto que la última etiqueta que lo contiene es una span que redefine el color que se le aplica con la etiqueta a.

<span class=linkred><a href=01.html>pagina_01</a></span>.

Con este código pagina_01 se mostrara en azul puesto que la última etiqueta que lo contiene es la a y redefine el color aportado por el elemento padre span.

No obstante se suele intentar conseguir lo mismo con la menos cantidad de etiquetado posible con lo que el código realmente óptimo sería las etiquetas a sin las span.

<a href=01.html class=linkred >pagina_01</a>.

La clase añadida a la etiqueta a hace el mismo efecto que quieres conseguir y la web se quedará más limpia de código para que resulte más fácil hacer modificaciones.

Ahora mientras espero lo del mailto vía php.

Estoy acabando un trabajo de unas web, tan pronto como pueda empiezo a prepararlo.

Dame un mes más de estudio y os acepto el reto.

Esperaré impaciente. Un saludo.

[Pit [reloaded]]

Gracias tío, entonces el código debería quedar así:
p><a href=index.html class=linknaranja>home</a> <a href=01.html class=linkgranate>pagina_01</a> <a href=02.html class=linknazul>pagina_02</a></p>.

[MooDiE]

Efectivamente, aunque para ya dejarlo todo listo, los elementos de menú se suelen meter dentro de algún elemento de tipo block, div, por ejemplo, (en el nuevo html5 se ha creado un elemento nuevo para este fin nav, pero hay que hacer algunos cambios para que funcione en todos los navegadores).

Entonces tendríamos css de este tipo.

Linkazul{color: blue;}.

Y el código estaría dento de un elemento div.

<div id=navigation><a href=index.html class=linknaranja>home</a> <a href=01.html class=linkgranate>pagina_01</a> <a href=02.html class=linknazul>pagina_02</a></div>.

Usa también cosas de este tipo en css.

A:hover{color:black;}.

Si pones en css un elemento seguido de :hover ese estilo se aplicará únicamente cuando el ratón pase por encima del elemento. Y si no es así se mostraría el estilo del elemento definido por defecto.

[Pit [reloaded]]

Si pones en css un elemento seguido de :hover ese estilo se aplicará únicamente cuando el ratón pase por encima del elemento. Y si no es así se mostraría el estilo del elemento definido por defecto.

Sí, estoy en ello, de hecho, en el.style, css, dentro ya están estas clases, y estaba experimentando con ellas:
Linkgranate { color: #736266, font-family:verdana, Génova, sans-serif, font-size:14px, text-decoration: none;}
.linkgranate:link { color: #736266, font-family:verdana, Génova, sans-serif, font-size:14px, text-decoration: none;}
.linkgranate:visited { color: #736266, font-family:verdana, Génova, sans-serif, font-size:14px, text-decoration: none, text-decoration: none; }
.linkgranate:hover { color: #d0d0fb, font-family:verdana, Génova, sans-serif, font-size:14px, text-decoration: none;}
.linkgranate:active { color: #736266, font-family:verdana, Génova, sans-serif, font-size:14px, text-decoration: none, text-decoration: none;}.linknaranja { color:#fc3, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknaranja:hover { color:#f33, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknaranja:link { color:#fc3, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknaranja:visited { color:#fc3, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknaranja:active { color:#fc3: font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }.linknazul { color:#6f, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknazul:hover { color:#00f, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknazul:link { color:#6f, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknazul:visited { color:#6f, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }
.linknazul:active { color:#6f, font-family:verdana, helvética, sans-serif, font-size:14px, text-decoration: none; }.

Bueno, sigo a lo mío, ya te dije que hasta abril tengo mis meses sabáticos para estudiar esto, es ahora o nunca.

[MooDiE]

Bueno, sigo a lo mío, ya te dije que hasta abril tengo mis meses sabáticos para estudiar esto, es ahora o nunca.

Hay que pegarle fuerte entonces, yo para la semana que viene que tengo un hueco, subiré lo del formulario de contacto en php. Aunque antes enseñaré como montar un servidor de pruebas básico con Mac (el programa es muy parecido al de Windows, no habrá problemas) ya que, si no tienes un servidor de php, no podrás ejecutar código php.

[Pit [reloaded]]

Yo uso Windows XP de hecho, he preparado y limpiado un portátil para todo esto del web, los dos ordenadores de infografía vamos a dejarlos como están, que soy algo manazas.

[MooDiE]

Ok, para el desarrollo en local necesitarás el famoso Xampp para Windows. Con esto montaras un servidor de pruebas en red local y podrás ejecutar código php.

Si mal no recuerdo puedes descargarlo de aquí (es software libre): http://www.apachefriends.org/octogono/Xampp.html.

[Pit [reloaded]]

Gracias esta noche me quité un curro de encima y retomo el estudio los formularios en xhtml los voy a estudiar por aquí: http://www.librosweb.es/xhtml/capitulo8.html si sabéis alguna web mejor no dudéis en soplarmela sé hacerlos en Dreamweaver con los botones, pero sigo lo que me indicasteis y estoy haciéndolo todo por cógigo, a pelo.

Nedie dijo que esti sería un paseo.

[MooDiE]

El contenido no es malo, sigue por ahí.

Nedie dijo que esti sería un paseo.

Cuando quieras no retamos entonces.

[Pit [reloaded]]

Ya estoy programando los css pronto, pronto habrá reto.

[MooDiE]

Pronto, pronto habrá reto.

Yuhu. Yo en cuanto acabe un diseño en Adobe Photoshop de una nueva web, me pongo con ese formulario. A ver si acabara hoy todo el trabajo de diseño.

[Pit [reloaded]]

En cuanto acabe un diseño en Adobe Photoshop de una nueva web.

Tengo enlaces y documentación guardada sobre eso, aunque por no dispersarme, hasta que no programe con más soltura no las miraré pero me sorprende, creo que tengo un buen nivel de Photoshop, pero las webs que hice abocetaba directamente en Dreamweaver ya me contareis sobre partir desde pohotoshop posdata: ayer entregué el último curro fuerte que me quedaba por despejar, creo que ahora voy a poder disponer de unas semanas con todo el día para estudiar.

[MooDiE]

Para bocetar webs se usa un programa de mockups (muchos de Windows usan visio de Microsoft, omnigrafle para Mac), luego también he visto que usan Illustrator, Adobe Photoshop o el software de Adobe específico para esa tarea que es Fireworks.

Diseño se suele hacer con Adobe Photoshop, existen plantillas para diseñar con Adobe Photoshop, http://960.gs, bájate el descargable de esta web y aparte de algunos css ya definidos por defecto, encontraras un.psd o.ai, en fin, hay muchos para que puedas empezar a bocetar las web y diseñarlas con la anchura que ahora se usa (960px). Los psd no son más que las guías verticales formado columnas para que puedas distribuir el contenido correctamente.

[Pit [reloaded]]

Por si pasáis por aquí, Modie o kashir, un par de cosas, a las 04.49 de la madrugada estudiando (y mañana tengo curro, con dos clientes apretando).
1: estoy ya maquetando (obligándome a teclear código, a pelo) y parto de tu.center-Layout:
/*Modie rules*/
.center-Layout {
Width:960px;
Margin:0 auto;
Overflow: hidden;
//border:1px solid red;
}.

Un par de cosas, por que partes del overflow:hidden, si parece más práctico dejarlo en auto?
El borde rojo, cuando pasas el puntero. ¿puedes comentarme esa forma de escribirlo con // pues no encuentro documentación en http://www.librosweb.es sobre eso?

[Pit [reloaded]]

2, y ésta que va a ser un ladrillo, lo siento, pero me despista este problema. En www.librosweb.es en la documentación, en las unidades relativas se advierte de lo siguiente:
por otra parte, uno de los problemas habituales cuando se utilizan unidades relativas es el problema del texto cada vez se ve más pequeño o el texto cada vez se ve más grande.
el siguiente ejemplo muestra el primer caso:
div { font-size: 0.9em; }
div>
p>texto 1</p>
div>
p>texto 2</p>
div>
p>texto 3</p>
/div>
/div>
/div>
y efectivamente así ocurre si:
<.doctype html public -//w3c//dtd html 4.01 transitional//en http://www.w3.org/tr/html4/lose, dtd>
<html>
<head>
<meta http-equiv=content-type content=text/html, charset=utf-8>
<title>pruebas unidades relativas</title>
<style>
div { font-size:9em; }
</style>
</head>
<body>.
<div>
<p>malditas unidades relativas</p>
<div>
<p>malditas unidades relativas</p>
<div>
<p>malditas unidades relativas</p>
</div>
</div>
</div>
</body>
</html>.
sin embargo, enredando, veo el problema desaparece si:
.doctype html public -//w3c//dtd html 4.01 transitional//en http://www.w3.org/tr/html4/lose, dtd>
html>
head>
meta http-equiv=content-type content=text/html, charset=utf-8>
title>pruebas unidades relativas</title>
style>
div#prueba1 { font-size:9em; }
/style>
/head>
body>.

Div id=prueba1>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
/div>
/div>
/div>.
/body>
/html>.
aunque si combino los dos casos, el problema vuelve a aparecer:
.doctype html public -//w3c//dtd html 4.01 transitional//en http://www.w3.org/tr/html4/lose, dtd>
html>
head>
meta http-equiv=content-type content=text/html, charset=utf-8>
title>pruebas unidades relativas</title>
style>
div { font-size:9em; }
div#prueba1 { font-size:9em; }
/style>
/head>
body>.

Div>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
/div>
/div>
/div>.

Div id=prueba1>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
div>
p>malditas unidades relativas</p>
/div>
/div>
/div>.
/body>
/html>.
no entiendo muy bien.

En el primer caso uso: div { font-size:9em; }
y aparece el problema.
si no uso ese css y en su lugar uso div#prueba1 { font-size:9em; }
el problema desaparece.
pero si uso los dos:
div { font-size:9em; } y div#prueba1 { font-size:9em; }
y en el segundo div le aplico el id=prueba1
el problema se reproduce en los dos.

En la documentación, en la colisión de estilos se decía:

1. cuanto más específico sea un selector, más importancia tiene su regla asociada.
2. a igual especificidad, se considera la última regla indicada.

por lo que no entiendo por qué en el tercer caso me ignora div#prueba1 { font-size:9em; } que en teoría es más específico.
o a lo peor me he liado y tengo una gran empanada Mental .

[Pit [reloaded]]

Bah, paso, la relatividad de la relatividad el 0.9em no tiene arreglo podía haber empleado el tiempo en algo más productivo.

[MooDiE]

Bah, paso, la relatividad de la relatividad el 0.9em no tiene arreglo. Podía haber empleado el tiempo en algo más productivo.

Voy a tener que reemplazar el código css de un sitio entero solo por usar la unidad de medida em, cada día veo menos gente que usa este tipo de medida, este sitio en cuestión en resoluciones muy específicas de monitor provoca una estructuración del sitio que no es la esperada, px de toda la vida.

[Pit [reloaded]]

Está claro, sí pero tenía que probarlo para desencantarme de los puñeteros me y ex.
2 o 3 horas de madrugada he estado con eso, y ahora muerto de sueño tengo que estar trabajando.

[MooDiE]

Por si pasáis por aquí, Modie o kashir, un par de cosas, a las 04.49 de la madrugada estudiando (y mañana tengo curro, con dos clientes apretando).

Leí el mensaje a las 5:15 de la madrugada, parece ser que, se programa mejor a las tantas.

1: estoy ya maquetando (obligándome a teclear código, a pelo) y parto de tu.center-Layout:
/*Modie rules*/.

Center-Layout {.
Width:960px.

Margin:0 auto.

Overflow: hidden.
//border:1px solid red.
}.

Un par de cosas, por que partes del overflow:hidden, si parece más práctico dejarlo en auto?
El borde rojo, cuando pasas el puntero. ¿puedes comentarme esa forma de escribirlo con // pues no encuentro documentación en http://www.librosweb.es sobre eso?

Lo de overflow es para que la capa coja altura si tiene elementos flotantes en su interior (float) no hay diferencia de usarlo con hidden o auto, a efectos prácticos es la misma siempre y cuando no se le defina altura a esta capa y no se vea bloqueada. Si está en auto y la capa no puede crecer a lo largo aparecerá el scroll. Teniendo en cuenta eso es cuestión de gustos.

Lo de la doble barra al lado de border en programación es un comentario de línea. A diferencia del comentario de párrafo (/*comentario de párrafo*/) que hasta que no se cierre el comentario no acaba, con // el comentario solo afecta a una línea. Lo uso para activar/desactivar el borde de los elementos mientras voy maquetando y cuando lo paso a producción elimino esa líneas completas con una búsqueda.

Si el sueño no me traicionó creo haber leído algo de porque estaba en el Margin el 0 y el auto. Cuando se ponen dos valores el primero es el margen superior e inferior y el segundo derecho e izquierdo. De este modo el margen superior/inferior vale 0 y el derecho/izquierdo se centraría automáticamente.

Por cierto, no me olvido del formulario de contacto, pero últimamente no doy a basto, en cuanto acabe este trabajo buscaré un hueco y lo monto.

[MooDiE]

Está claro, sí. Pero tenía que probarlo para desencantarme de los puñeteros me y ex.
2 o 3 horas de madrugada he estado con eso, y ahora muerto de sueño tengo que estar trabajando.

A efectos prácticos, cuando tienes que crear un sitio con imágenes que encajan al píxel es una locura. Aunque siempre habrá donde se use aún sobre todo cuando los sitios tengan que ser accesibles, ya que, con las unidades me se produce un escalado de las fuentes.

Si el sitio tiene que ser accesible puedes usar esta propiedad.

Body {.

Font-size: 62.5%.
}.

Con esto consigues que 1em = 10px y todo será más fácil a la hora de maquetar. Yo uso también esta web para ver las tablas de conversión entre unidades http://pxtoem.com/.

[Pit [reloaded]]

Si el sueño no me traicionó creo haber leído algo de porque estaba en el Margin el 0 y el auto.

No te traicionó, lo busqué y lo encontré, por eso lo borré.

[MooDiE]

He buscado la información que usé en la web que se descolocaba con las unidades em, en el mensaje anterior te dejo el código que usé para hacer un poco más fácil la reescritura del código css.

[Pit [reloaded]]

Este fin de semana, aprovechando que llueve y que he entregado los curros y que hasta el lunes no volverán a forrarme a ostias me machaco el css y pruebo a arrancar con una página sólo con código, sin el arrastrar y soltar del Dreamweaver si puedo con ello, la semana que viene arranco con javascript y Doom.

[MooDiE]

Por lo que no entiendo por qué en el tercer caso me ignora div#prueba1 { font-size:9em; } que en teoría es más específico.

O a lo peor me he liado y tengo una gran empanada Mental.

Huy. Había olvidado de contestarte a este tema.

<.doctype html public -//w3c//dtd html 4.01 transitional//en http://www.w3.org/tr/html4/lose, dtd>.

Html>.

Head>.
meta http-equiv=content-type content=text/html, charset=utf-8>.
title>pruebas unidades relativas</title>.
style>.

Div { font-size:9em; }.

Div#prueba1 { font-size:9em; }.
/style>.
/head>.
body>.

Div>.

P>malditas unidades relativas</p>.

Div>.

P>malditas unidades relativas</p>.

Div>.

P>malditas unidades relativas</p>.
/div>.
/div>.
/div>.

Div id=prueba1>.

P>malditas unidades relativas</p>.

Div>.

P>malditas unidades relativas</p>.

Div>.

P>malditas unidades relativas</p>.
/div>.
/div>.
/div>.
/body>.
/html>.

En este tercer caso, especificas que div#prueba1 { font-size:9em; } tenga.9em hasta ahí bien, pero como también especificas div { font-size:9em; } entonces si la unidad me se comporta de la siguiente manera.

Si empleas la unidad em para especificar el tamaño de la letra (font-size) entonces el valor de me es relativo al tamaño de letra del elemento padre que lo contiene.

El tamaño de las letras se hará más pequeño, ya que para la primera capa div#prueba1, la segunda capa contenida dentro de div#prueba1 y que no postura un identificador (solo tiene <div></div>) tendrá un 0.9em menor que el tamaño de su elemento padre (en este caso div#prueba1). Y como a su vez dentro de esta div existe otra div (recordamos que todas las divs por css tienen un valor de 0.9em) será 0.9em luego se hará más pequeña.

Es un poco lioso, lo sé.

[Pit [reloaded]]

Gracias, tío, al final ya me quedó claro que andar reduciendo o ampliando los me y os ex no da más que problemas. Sobre la anchura de las páginas.

Tú partes de una anchura fija de 960px sin embargo, en la guía de librosweb, es mencionan:
cuando se diseña la estructura de una página web, se debe tomar la decisión de optar por un diseño de anchura fija o un diseño cuya anchura se adapta a la anchura de la ventana del navegador.
sin embargo, la mayoría de las veces sería conveniente una solución intermedia: que la anchura de la página sea variable y se adapte a la anchura de la ventana del navegador, pero respetando ciertos límites. En otras palabras, que la anchura de la página no sea tan como para que no se puedan mostrar correctamente los contenidos y tampoco sea tan ancha como para que las líneas de texto no puedan leerse cómodamente.

Cómo lo ves, mejor fija o variable?