Firefox - Sempre bloqueie e use o espaço de um dado elemento

Question

Eu gostaria de bloquear um elemento específico em um site, toda vez que faço isso, e eu quero fazer isso para qualquer elemento em uma determinada página da Web quando eu quiser. Além disso, eu quero espaço liberado pelo elemento excluído ser usado para exibir mais do conteúdo do site.

Por exemplo, digamos que eu queira ocultar a barra lateral em Stackoverflow (id="sidebar") e deixar o conteúdo (id="content") preencher automaticamente o espaço liberado em seu lado direito (centrando-se por exemplo).

Também posso querer que um banner de anúncio em um site seja divulgado e o espaço usado para permitir que o site exiba mais conteúdo

Venho pesquisando extensões AdBlock, NoScript e Ghostery, elas bloqueiam e preenchem os espaços liberados por todos os "Google Like" "Google +1" etc. Mas não posso dizer a eles para bloquear especificamente um determinado elemento e deixar outro elemento tomar seu lugar de liberdade para se estender.

Se isso for possível, como posso alcançá-lo?

Também aceito as respostas do Google Chrome, mesmo que eu esteja procurando por aquelas do Firefox, de preferência Eu aceito soluções "parciais", como apenas bloquear um dado elemento e não permitir que os outros ocupem o espaço liberado (o que eu acho que pode ser impossível).

    

Answer 1

Originalmente eu postei a extensão Yarip como sendo capaz de realizar o que você quer. Como apontado por JohnKiller em muitos casos, ele não fará o trabalho por causa dos problemas de largura / margem que ele mencionou.

Firebug + Firediff (para exportar as alterações) + Stylish (para tornar as alterações persistentes) é definitivamente o caminho a percorrer. Consegui identificar o que era necessário para se livrar da barra lateral e refluir o texto como você queria em um tempo muito curto.

Eu incluí um trecho de estilo elegante para cuidar da barra lateral apenas para que você possa ver como é simples. Todos os valores a serem alterados foram encontrados com o firebug.

@-moz-document domain(superuser.com), domain(stackoverflow.com) {
    #sidebar, .sidebar {
        visibility: hidden
    }
    #mainbar, .mainbar {
        width: 980px
    }
    .question-summary {
        width: 980px
    }
    .narrow .summary {
        width: 799px
    }
}

Observe que isso funciona apenas na página principal. Você adicionará mais algumas alterações para obter o Q & Uma página para parecer certa.

Dito isto, se você realmente não quiser se aprofundar no CSS (o Firebug torna isso realmente fácil), existe outra extensão que você pode tentar: HackTheWeb. Isso permite que você remova divs e expanda e reflua os outros para compensar com apenas algumas teclas, não é necessário modificar o CSS. Você ainda precisará instalar a extensão Stylish se quiser salvar suas alterações. Anote as restrições de versão (conforme indicado na página HackTheWeb) necessárias para que suas alterações persistam.

Honestamente, acho que você gastará muito tempo tentando fazer com que ele realize o que você quer, porque ele simplesmente não tem o poder de modificar todas as propriedades, como o Firebug faz. Eu tentei - definitivamente não funciona tão bem no Stack Overflow sem mergulhar e escrever regras manualmente no Stylish.

Se você optar por usá-lo, aqui está um guia para as teclas .

    

Answer 2

Isso não é possível com uma abordagem genérica que funciona em todos os lugares.

Você só pode usar uma ferramenta como o Greasemonkey e escrever scripts direcionados a sites específicos e ajustar larguras de acordo.

Isso ocorre porque outros itens na página geralmente têm um "width" definido para acomodar a presença do item que você deseja remover (ou uma "margem" se o layout for fluido).