Cantos arredondados no Internet Explorer (sem imagens)
Em desuso. Esse código está ultrapassado em nosso padrão, então evitamos usá-lo. Com os recursos que temos atualmente, podemos fazer cantos arredondados diretamente pelo CSS para os browsers Firefox e...
View ArticleClik here to view.
Listagem horizontal com itens de mesma altura
Listagem horizontal onde os itens de lista vão ficar sempre com tamanho igual (se baseando na altura do maior dos itens): utilizando somente HTML e CSS. Seria uma listagem no modelo da Americanas.com e...
View ArticleDocumento base para HTML
Aqueles que acompanham o Blog Web Standards, sabem que já temos o Documento base para XHTML, que serve como o primeiro passo para qualquer projeto, inserindo meta tags e a estrutura necessária para...
View ArticleUnidade de medida – em
Por questões de compatibilidade entre os navegadores, nós adotamos como padrão a unidade de medida “em”, principalmente para definição do tamanho das fontes. “em” é uma medida relativa, isso quer dizer...
View ArticleRepositório de Snippets: HTML, CSS, Microformats, jQuery e WordPress
Pensando em deixar o desenvolvimento de códigos mais prático, publicamos nosso Repositório de Snippets, lugar onde colocaremos trechos de código modulares que usamos comumente em nossos projetos....
View ArticleClik here to view.
Bug Firefox – button com elemento dentro
Veja como resolver o bug no Firefox durante a estilização de um botão flexível (quando se usa um elemento dentro do button). Layout do botão: HTML: <button class="botao"...
View ArticleClik here to view.
Desabilitar e remover estilo da tag details e summary
Após uma atualização do Google Chrome, percebemos que todos nossos códigos estavam bugados pois a forma que o navegador estava renderizando a tag details é diferente. Procuramos formas para resetar...
View ArticleClik here to view.
Google Chrome Frame
O Google Chrome Frame possui uma proposta de simplesmente “substituir” o motor de renderização do Internet Explorer, habilitando praticamente todos os recursos que estariam disponíveis no navegador...
View ArticlePadrão de formulários
Sempre utilizamos um estilo base para formulários quando trabalhamos com páginas de cadastro, login, etc. Consequentemente possuímos uma forma bem similar para escrever nossos códigos para formulários....
View ArticleLimite de dimensões de imagem no Safari para iOS
Estávamos desenvolvendo um projeto com CSS Sprites, utilizando uma imagem de background com 3000px x 2800px. Ao testarmos o layout responsivo no iPad, a imagem não aparecia! Eis que, ao diminuir as...
View ArticleNovo projeto da nossa equipe
Nossa equipe havia planejado criar um site com uma extensa documentação sobre o que tudo o que envolve o trabalho de um front-end developer, além de indicações para designers de interface web para...
View ArticleMelhorando a performance do site: compressão Gzip
Um dos pontos que mais afetam a usabilidade, levando em conta principalmente o acesso por dipositivos móveis, é o tempo de carregamento do site, devido ao peso dos arquivos estáticos (imagens, css,...
View ArticleComo remover cantos arredondados de campos de formulário no iOS
Se você precisa retirar os cantos arredondados (ou outras características do padrão visual destes elementos) no iOS, é só usar o código abaixo: textarea, input[type=”text”], input[type=”button”],...
View ArticleSelecionando o penúltimo elemento no CSS com :nth-last-child()
É comum utilizarmos o seletor :nth-child() para selecionar o itens dentro de uma regra específica (segundo, terceiro e assim por diante), em conjunto com :first-child e :last-child. Porém o CSS também...
View ArticleClik here to view.
Foundation for Emails: como evitar o HTML minificado no build
Estamos desenvolvendo os e-mails utilizando o Foundation for Mails, e notei algo que pode ser muito útil. Por padrão, esse framework gera o HTML minificado (sem espaços, tudo em uma mesma linha), o que...
View Articleoverflow: hidden no Safari do iOS
Está tendo problemas com overflow: hidden no Safari? No meu caso estou criando uma tabela com scroll horizontal em telas menores porém, com este problema, ficava um espaço horizontal vazio...
View ArticleWordPress Contact Form 7: problemas com autofill
Estávamos enfrentando um problema com o preenchimento de formulários no plugin Contact Form 7 do WordPress: ao utilizar o autocomplete do navegador em determinados campos, as informações destes inputs...
View ArticleComo criar um elemento com 100% de largura da tela, mesmo dentro de outro...
Surgiu a necessidade de definir imagens em posts de blog que ocupem a largura toda da tela, mesmo dentro de um elemento (container) que respeite os limites da página. Supondo que o elemento container...
View ArticleChrome: bug com mix-blend-mode e position fixed
Estou trabalhando com um novo projeto e uma das páginas internas possui efeito de mix-blend-mode, para que a imagem tenha um efeito com a cor do background em seu elemento pai, como efeitos de layers...
View ArticleComo detectar se o dispositivo suporta hover?
Um recurso muito interessante das CSS media features é a possibilidade de escrevermos regras baseadas no input primário do usuário, ou seja, se o dispositivo utilizado para acesso tiver capacidade...
View Article![The Drum Drum Show escrita por HeyBae00 [Livre]](http://static.fanfiction.com.br/userfiles/D/3/D/5/capa_850994_1713813037.jpg)
