<------------------ Y de pronto una barra separadora salvaje aparece ----------------->
Se que en el indice originalmente puse estas clases como separadas, pero fue antes de empezar a usar videos para realizar las clases, asique pude juntar las 2 clases en 1 solo video. Dura 40 minutos, asique te recomiendo que lo veas cuando tengas tiempo...
Esta vez me gaste como 1hora para editarlo, aplicando zooms para que te sea mas facil leer el codigo, asique trata de no criticar demasiado, porque este video me costo su tiempo.
* Casi todas las veces en que recargo la pagina que muestra el resultado de los cambios del codigo, no lo aviso, pero estoy apretango F5 cada vez. Lo aclaro para que no pienses que se actualizan solos los cambios.
** Cuando digo que voy a guardar los cambios en el codigo, estoy apretando Ctrl + S. Lo aclaro para que no pienses que el magico contenido se guarda solo.
Durante el video, dije que explicaria como solucionar la desprolijidad generada por usar un hover cuadrado sobre un div con bordes redondeados (En el menu de usuario). Aca dejo como deben quedar los elementos dentro del menu, desde HTML. Perdon por no explicarlo en el video, me olvide completamente.
<ul class="ul_usuario">
<a href="perfil.php"><li style=-moz-border-radius-topleft:5px;-moz-border-radius-bottomleft:5px;-webkit-border-top-left-radius:5px;-webkit-border-bottom-left-radius:5px;border-right:1pxsolid#004160;>Cifer94</li></a>
<a href="misposts.php"><li style=border-right:1pxsolid#004160;>Posts</li></a>
<a href="perfil.php"><li style=border-right:1pxsolid#004160;>Perfil</li></a>
<a href="logout.php"><li style=-moz-border-radius-topright:5px;-moz-border-radius-bottomright:5px;-webkit-border-top-right-radius:5px;-webkit-border-bottom-right-radius:5px;>Salir</li></a>
</ul>
-moz hace alusion al navegador mozzilla, y -webkit sirve para que lo interpreten los navegadores chrome y safari. El resto es bastante facil de deducir... =P
Y aca dejo el codigo hecho de las publicidades, para que lo copies dentro del div con clase "bloque3". Es solo a modo de ilustracion.
<div style=background:#EEF9FF;width:250px;float:left;border:1pxsolid#76B5D7;padding-bottom:10px;><div style=color:#092167;font-size:16px;font-weight:bold;margin:5px010px5px;>Nuevo boton de Pedorringa!</div><div style=float:left;width:75px;margin:010px05px;> <div style=color:#4177A1;font-size:18px;font-weight:bold;background:#F0F8FF;float:left;border:1pxsolid#568DB9;-moz-border-radius-topleft:5px;-moz-border-radius-topright:5px;-webkit-border-top-left-radius:5px;-webkit-border-top-right-radius:5px;padding:8px27px;>20</div> <div style=background:#005FA8;font-size:11px;font-weight:bold;color:#FDFDFD;padding:3px2px3px3px;float:left;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;>PEDORRINGA!</div></div><div style=float:left;color:#3E83A8;font-size:12px;width:155px;>Con el nuevo boton social de Pedorringa! los usuarios podran recomendar tu web muy facilmente!</div></div><div style=padding:10px0;float:left;width:250px;></div><img src="http://googleads.g.doubleclick.net/simgad/12301818260852383402" />
Desde el propio post seria muy jodido explicar este codigo, ya que en un principio no lo hice para ser explicado, pero si queres podes intentar entender lo que significa cada parte de el, aunque no lo recomiendo, es muy compacto y no se diferencian bien sus partes. Recomiendo un simple copy/paste dentro de tu bloque3.
Este video contiene muchos conceptos que normalmente, en otro videocurso o manual, se explican teoricamente cada uno por separado y con tiempo. Asique este vendria a ser un curso intensivo para noobs. Si no entendes algo, no tenes la culpa, comenta tu duda y voy a ayudarte tanto como me sea posible.