Disponibilizando seu site como opção de busca no Firefox e Internet Explorer 7
21/03/07
Para adicionar seu site como opção de busca no Firefox ou Internet Explorer 7 (IE7), você pode utilizar o padrão Open Search.
Primeiro, crie um arquivo XML com o seguinte conteúdo:
<?xml version="1.0"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/">
<ShortName>Sounds Like</ShortName>
<Description>Sounds Like Search - Type a band or artist to find albums and related artists</Description>
<InputEncoding>UTF-8</InputEncoding>
<Image height="16" width="16" type="image/x-icon">http://soundslikenow.org/favicon.ico</Image>
<Url type="text/html" method="get" template="http://soundslikenow.org/search?name={searchTerms}&source={referrer:source?}" />
</OpenSearchDescription>
Não se esqueça de trocar as informações acima com os dados do seu próprio site, claro! Como eles são auto-descritivos, não vou explicar um a um.
Depois, a única coisa que você precisa fazer é adicionar uma tag link ao seu site. Ela deve ter o seguinte formato:
<link rel="search" type="application/opensearchdescription+xml" title="Sounds Like" href="http://soundslikenow.org/search.xml" />
O valor do atributo href deve apontar para o arquivo XML criado anteriormente. Quando um usuário acessar o seu site, ele poderá adicionar o seu mecanismo de busca. Veja como fica:


Para ver como funciona, acesse o Sounds Like.
- Permalink
- Trackback
- Comentários (0)
- Ao som de: Green Day – Whatsername
Definindo a largura do date_select no Rails
17/02/07
Tenho o costume de zerar todos os espaçamentos dos elementos HTML para uniformizar entre os browsers. Na prática, tenho uma regra CSS como a seguinte:
* {
margin: 0;
padding: 0;
}
Isso causa um problema que afeta os campos "select" no Firefox. Os campos ficam com um tamanho reduzido, dificultando a visualização de seus valores, um problema principalmente para o date_select:

Como o problema é no Firefox, a solução é bem simples e puramente em CSS:
/* day */
select[name*="1i"] {
min-width: 4.2em;
}
/* month */
select[name*="2i"] {
min-width: 7.2em;
}
/* year */
select[name*="3i"] {
min-width: 3.2em;
}

Ainda bem que foi com o Firefox! ;)
- Permalink
- Trackback
- Comentários (6)
- Ao som de: Letters to Cleo – Disappear
Image Replacement em elementos input
11/02/07
Neste post, expliquei como eu estava querendo aplicar um fundo a elemento button. Eu e o Rapha aqui do UOL descobrimos ontem uma maneira de fazer isso no elemento input.
Olha que fácil. No markup:
<input type="button" value="Um botão" />
E o CSS:
input {
border: none;
background: url(http://m.simplesideias.com.br/document-save-as.png) no-repeat;
content: ""; /* opera */
display: inline-block; /* opera */
height: 32px;
line-height: 0; /* ie */
text-indent: -9999px;
width: 32px;
}
O melhor de tudo é que funciona até no Opera, coisa que não tinha conseguido fazer antes! ;)
Veja o resultado nos navegadores IE6 Standalone, IE7, Firefox 2 e Opera 9:


- Permalink
- Trackback
- Comentários (21)
- Ao som de: Ramones – Danny Says
