Facebook sem publicidade em Chrome e Firefox

Usas Chrome ou Firefox?
Estás farto de publicidade inútil no Facebook?
Estás farto de posts publicitários invasivos no teu feed?
Detestas ver por cima da publicidade uma lista enorme de convites para aplicações que não queres usar?

Se respondeste três vezes sim, então talvez queiras tentar algo que implementei hoje no meu browser.

Passo 1:
Instala no teu browser de eleição o plugin Stylish (caso ainda não o tenhas).
Download do Stylish para: Chrome ou Firefox

Passo 2:
Acede às opções do plugin e configura para o endereço facebook.com o seguinte CSS:

/* hide timeline and feed ad blocks */
*[data-referrer^=pagelet_ego_pane], *[data-referrer=pagelet_side_ads]{display:block;}

/* remove ads from your facebook feed... targeted advertisement? yeah right. */
.homeWiderContent .uiStreamStory[data-ft*=',"ei":']{display:none;}

/* larger timeline */
li.about.tile{width:486px !important}
.timelineLayout #contentArea{width:980px !important}
.fbTimelineTwoColumn .photoUnit .photoWidth1 .photoWrap{width:468px; height:468px;}
.timelineUnitContainer .uiCommentContainer{width:468px;}
.fbTimelineCapsule div.fbTimelineComposerUnit{width:464px}
.fbTimelineTwoColumn .timelineUnitContainer{width:444px}
.fbTimelineCapsule .bottomBorder,
.fbTimelineCapsule .topBorder{width:474px; background:#fff !important; border-width:1px 1px 0px 1px; border-color:#C4CDE0; border-style:solid;}
.fbTimelineCapsule .bottomBorder{border-width:0px 1px 1px 1px}
.fbTimelineUnit:hover .bottomBorder, .fbTimelineUnit:hover .topBorder{border-color:#97A4C4;}
.fbTimelineCapsule .fbTimelineOneColumn .spinePointer{left:483px;}
.fbTimelineCapsule .fbTimelineOneColumn .topBorder,
.fbTimelineCapsule .fbTimelineOneColumn .bottomBorder{width:978px;}
.fbTimelineOneColumn .uiCommentContainer{width:972px}
.fbTimelineOneColumn .timelineUnitContainer ._1y2 ._1y3{width:948px;}
.fbTimelineOneColumn .timelineUnitContainer ._1y2 .exploded{width:972px}
.fbTimelineFriendsBoxLarge{width:471px;}
.fbTimelineFriendsBoxLarge .friendListingWider .friendPhoto,
.fbTimelineFriendsBoxLarge .friendPhoto{width:114px; height:114px;}
.timelineReportContainer .timelineReportContent .timelineUnitContainer{width:438px}
.fbTimelineStickyHeader .back{width:978px;}
.fbTimelineStickyHeader .stickyHeaderWrap{width:980px}

/* larger feed page */
#rightCol{display:none}
.composerExpanded #contentArea,
.composerExpanded #contentArea img.img,
.composerExpanded #contentArea div{width:auto !important; height:auto !important; max-width:100%;}

Passo 3:
Acede a facebook.com. Se tudo estiver bem configurado, a timeline e o teu feed ficaram maiores, ocupando o espaço da publicidade que desapareceu. Também o teu feed deixou de conter posts automaticos de publicidade ligada a gostos dos teus amigos.

Espero ter melhorado a tua experiencia no Facebook! Até breve.

Alinhamento ao centro de blocos HTML sem largura definida

Enquanto o alinhamento centrado de um bloco, para o qual sabemos a sua largura, é relativamente simples via CSS com margens laterais definidas automaticamente (exemplo: margin-left: auto; margin-right: auto), já o mesmo alinhamento num bloco com largura variável requer um pequeno truque de CSS e HTML.

Então, como alinhar qualquer bloco ao centro?

HTML:

<div class="centered-block">
  <div class="outer-block">
    <div class="inner-block">
      <!-- bloco(s) a alinhar ao centro -->
    </div>
  </div>
  <div class="clear"></div>
</div>

CSS:

.outer-block, .inner-block {
  float: right;
  position: relative;
}
.outer-block {
  right: 50%;
}
.inner-block {
  right: -50%;
}
.clear {
  clear: both;
}

Exemplo:

Bloco DIV com width:auto para reset de largura
alinhado ao centro.