responsible desing

[flashmax]

Iniciado por laura_moreno14

perdon que sin querer no termine el mensaje

2. no consigo alinear los botones de seguir y me gusta

Código:

* { margin: 0; padding: 0; list-style-position:inside;}
html { font-size:100%; height:100%; font-family:Arial, Helvetica, sans-serif;}
body { width:100%; font-size:0.8em;}
/*Header*/
header { width:100%; background:#282828; overflow:hidden; height:100px;  box-shadow: 0px 0px 7px #000;}
#titulo a { width:18%; color:#FFF; float:left; font-size:4em; font-weight:bold; text-decoration:none; margin-left:1%; padding:0.6%; font-family: 'Alegreya SC';}
#social { width:15%; float:right; margin:1.7% 0 1% 1%;}
#social li { float:left; list-style:none; margin: 2%; opacity:0.5;}
#social li:hover { opacity:1;}
/* Nav*/
nav { width:98%;background:#93d22b; overflow:hidden; margin:1%;-moz-border-radius: 34px; border-radius: 4px;}
#menu { width:67%; float:left; font-size:1.2em; list-style: none;}
#menu a { color: #fff;float:left; text-decoration: none;  font-weight: bold;}
#menu a:hover { color: #fff;}
#menu li { float:left; padding: 3.5% 2.7% 3.5% 2.7%;}
#menu li:hover { float:left; padding: 3.5% 2.7% 3.5% 2.7%;background:#B3EE44;}
.buscador { width:30%;float:right; margin:1%; padding:0.5%;}
#search { width:80%;}
/*index, single, page*/
#wrapper { width:98%; margin: 0 auto; overflow:hidden; padding:1%;}
#contenedor2 { width:73%; float:left;}
#posts { width:94%; margin:3%; overflow:hidden;}
#posts a { color:#93d22b;}
#posts .printfriendly { float:right; text-decoration:none; color:#000;}
#posts .printfriendly:hover{ text-decoration:underline;}
#social2 {}
.twitter-share-button { margin-top:1%; padding:0;}
.fb-like { margin-bottom:1%; padding:0;}
p img { display:block; margin:auto; }
.metabox { margin: 2% 0; overflow:hidden;}
.metabox a{ color:#93d22b; text-decoration: none;}
.metabox a:hover { text-decoration:underline; color:#B3EE44;}
.meta {
background-repeat: no-repeat; 
padding-left:20px;
margin-bottom: 4px;
float:left;
height:16px;
background-position: center left;
}
.category {background-image: url(images/cate.png);}
.tags{background-image: url(images/tag.png);}
#previus { width:50%; float:left;}
#next { width:50%; float:left; text-align:right;}
#coments { margin-top:5%;}
/* Comments! */
 ol.commentlist {list-style-type: none; width:100%;position:relative;}
 ol.commentlist li {width:95%;overflow:hidden;background: #e1e1e1;-webkit-border-radius: 10px;border-radius: 10px;border: 1px solid #ccc;padding:2%;margin: 2% 0;}
 .comment-author { width: 60%;float:left;height:40px;}
 .comment-author img {float:left;border: 1px solid #ccc;margin: 2px;}
 .fn { color: #2d435a;font-weight:bold;font-size:14px;}
 .says {}
 .comment-meta { width: 40%;float:left;height:40px;text-align:right;overflow:hidden;}
 .comment-awaiting-moderation { width:100%; margin-right:10px; text-align:right;}
 .comment-meta a {}
 ol.commentlist li p {}
 .reply a {padding: 1%; background: #666; -webkit-border-radius: 10px; border-radius: 10px; border: 1px solid #ccc; color:#FFF; text-decoration:none; margin:1%; float:left;}
input { margin-bottom: 1%;}
/*category: biblioteca*/
 li.cat-item { list-style:none; padding:3%; border-bottom:1px #B3EE44 dashed;}
  li.cat-item:hover { background:#DBF86B;}
 /*archive*/
.cat{ overflow:hidden; border-bottom:1px #B3EE44 dashed; padding:3%;}
.cat:hover {background:#DBF86B;}
.enlace { float:left;width:100%; display:block; margin-bottom:2%;}
.enlace h1 a{text-decoration:none;}
.enlace h1 a:hover{text-decoration:underline;}
.contenedor { width:100%; float:left;}
.imagen { float:left; width:25%; display:block;}
.resumen { float:right; width:75%; display:block;}
.mas{ margin-top:3%; width:20%;}
.mas a { text-decoration:none;}
.mas a:hover { text-decoration:underline;}
/*sidebar*/
aside { width:25%; float:right; margin:0.8%;}
aside #buscador { display:none; }
.widget { overflow:hidden; width:88%; margin-bottom:3%; padding:0 6% 6% 6%;}
.widget li { text-decoration:none; list-style:none; border-top:1px #B3EE44 dashed; padding:3%;}
.widget li:hover { background:#DBF86B; text-decoration:none;}
.widget a { text-decoration:none; color:#000; }
.widget a:hover { text-decoration: none; color:#FFF;}
.encab { font-size:1.3em; font-weight:bold; color:#000; margin-bottom: 3%;}
.tagcloud a{ width:auto; float:left; height:auto; background: #93d22b; margin: 1%; padding:1%; color:#FFF; font-weight:bold; -moz-border-radius: 4px; border-radius: 4px;}
.tagcloud a:hover{background:#B3EE44; color:#FFF; -moz-border-radius: 4px; border-radius: 4px;}
/*paginacion*/
.pagenavi {margin:3% 0 5% 0;float:left;width: 100%;}
.pagenavi a {padding: 1%;margin-right: 1%;text-decoration: none;border: 0.1em solid #eee;color: #000;}
.pagenavi a:hover {border: .1em solid #000;color: #000;background-color: #eee;}
.pagenavi span.pages {padding: 1%;margin-right: 0.8%;color: #000;font-weight:bold;border: .1em solid #999;}
.pagenavi span.current {padding: 1%;margin-right: 0.8%;font-weight:bold; border: 0.1em solid #666;color: #000;}
.pagenavi span.expand {padding: 0;margin: 0;border: .1em solid #ccc;color: #000;}
.pagenavi .first, .pagenavi .last { border: .1em solid #aaa;}
.pagenavi .single_page {border: 1px solid #ccc;}
/*resultados de busqueda*/

/*footer*/
footer { width:97%; background:#000; overflow:hidden; font-size: 1.2em; padding:1.5% 1.5% 0.5% 1.5%;}
footer a { color:#FFF; text-decoration:none;}
footer a:hover { color:#93d22b;}
#colabora { width:100%; padding:1%;}
#colabora .encab { color:#93d22b; margin-bottom:0.5%;}
#colabora li { list-style:none;}
#enlaces { width:100%; overflow:hidden;}
#enlaces li { float:right; color:#FFF; list-style:none; margin: 1% 1% 1% 2%}

/* Large screens ----------- */
@media screen and (min-width : 1300px) {
#titulo a { font-size:4.8em;}
#social { width:15%; float:right; margin:2.5% 0 1% 1%;}
nav { width:18%; float:left; margin:1% 1% 1% 0;}
#menu { width:100%; overflow:hidden; font-size:1.4em; list-style: none;}
#menu a { color: #fff; overflow:hidden; text-decoration: none;  font-weight: bold;}
#menu a:hover { color: #fff;}
#menu li { width:92%;overflow:hidden; padding: 5% 0 5% 8%;}
#menu li:hover { float:left; padding: 5% 0 5% 8%;background:#B3EE44;}
.buscador { display:none; width:90%;float:right; margin:1%; padding:3% 0 10% 0;}
#posts { width:74%; float:right;}
p img { min-width:500px;}
#imagen {width:30%;}
#resumen { width:70%;}
}

/* iPads (portrait and landscape) ----------- */
@media screen and (max-width : 1050px) {
#titulo a { width:18%; color:#FFF; float:left; font-size:3.5em; font-weight:bold; text-decoration:none; margin-left:2%; padding:1%; font-family: 'Alegreya SC';}
#social { width:20%; float:right; margin:1.7% 0 1% 1%;}
#social li { float:left; list-style:none; margin: 2%;}
#menu { width: 75%; font-size: 1.1em;}
#menu li { float:left; padding: 2.5% 1.7% 2.5% 1.7%;}
#menu li:hover { float:left; padding: 2.5% 1.7% 2.5% 1.7%;}
.buscador { width: 22%; margin:1%; padding:0.2%;}
aside { width:25%; margin:0.8%;}
aside .buscador { display:none;}
}

/* iPads (portrait and landscape) ----------- */
@media screen and (max-width : 820px) {
#social { width:25%; float:right; margin:3% 0 1% 1%;}
#social li { float:left; list-style:none; margin: 2%;}
header #buscador { visibility:visible; width: 100%;}
#menu { width: 100%; font-size: 1em;}
#menu li { float:left; padding: 2.5% 2.3% 2.5% 2.3%;}
#menu li:hover { float:left; padding: 2.5% 2.3% 2.5% 2.3%;}
.buscador { display:none;}
#contenedor2{ width:68%;}
#posts h1 { font-size:1.7em;}
#imagen { float:none; margin: 2% auto;}
#resumen {width:100%; float:none}
aside { width:30%; margin:0.8%;}
aside .buscador { display:block; width:90%; margin:0 0 5% 10%;}
}


/* Smartphones (portrait and landscape) ----------- */
@media screen and (max-width : 480px) {
#header { height:50px; float:none;}
#titulo a { font-size:2.5em; padding:0.7%; margin-top:5%;}
#social { width:27%; float:right; margin:8% 0 1% 1%;}
#social li { float:left; list-style:none; margin: 0; opacity:0.5;}
#social li img { height:30px;}
#posts .printfriendly { font-size: 0.8em; }
#posts .printfriendly img{ height: 10px; }
#contenedor2 { width:100%;}
#imagen { float:none; margin: 2% auto;}
#resumen {width:100%; float:none}
aside { width:98%; margin:0.8%;}
footer { font-size: 1em;}
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 360px) {
#titulo a { font-size:2em;}
#social { width:30%;}
#posts h1 { font-size:1.2em;}
#posts img { max-width:300px;}
#social li img { height:20px;}
#imagen { float:none; margin: 2% auto;}
#resumen {width:100%; float:none}
#menu {  font-size: 0.9em;}
}

Hola te falto mostrar el html y si puedes pon un link del proyecto parar analizar la falla!