Como ajustar o banner do forum de acordo com a resoluçao do monitor?

[Wander Aline]

Detalhes da questão

Endereço do fórum: http://cmpc.forumeiros.com/
Versão do fórum: PhpBB3

Descrição

Como ajustar o banner do forum (Imagem de fundo do menu de navegação) de acordo com a resoluçao do monitor, para que a imagem se ajuste automaticamente que nao duplique em monitores maiores e nem seja cortada em monitores menores

[Wander Aline]

up

[Guh_.]

Tudo depende da resolução da imagem, para atingir todo o fundo você precisara de uma imagem com no minimo a resolução de 1620 x 1080 px.
Espero ter ajudado!

[Wander Aline]

Cara vc nao entendeu a resolução esta ok no meu pc que e um monitor de 24p fica top normal agora em um pc com um monitor menor(ex:14p) ou um monitor que usa resolução menor ela e cortada eu quero um jeito de nao acontecer isso.
Igual e o banner desse forum aqui do ajuda forumeiros independentemente de voce estar em um pc ou em um celular ou um pc com um monitor pequeno a imagem sempre ficara normal nao e cortada ela e ajustada automaticamente

[Daemon]

Adiciona na folha de CSS:

Código:

.headerbar {
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}

[Wander Aline]

sem sucesso man

[Wander Aline]

segue minha folha de CSS pra ver se ajuda em algo

Código:

body {
cursor: url('http://2img.net/s/t/13/41/58/i_icon_mini_index.gif'), url('http://2img.net/s/t/13/41/58/i_icon_mini_index.gif'), auto;
}
a:hover {
cursor: url('http://2img.net/s/t/13/41/58/i_icon_mini_index.gif'), url('http://2img.net/s/t/13/41/58/i_icon_mini_index.gif'), auto;
}
a[href="/u1"] {
    background: url("http://i.imgur.com/ZFoje.gif");
}
a[href="/u1"] {
text-shadow: 0px 0px 5px #FF0000;
}
#wrap{-moz-border-radius:10px;-moz-box-shadow:0 0 20px #fff;-webkit-border-radius:20px;-webkit-box-shadow:0 0 20px #fff;border:3px solid #F2FF00}
#wrap{width: 72.7% !important;
}
li.header dd{text-align:center}.table-title h2 {font-family: martel; font-size: 1.6em}
body { banner-repeat: no-repeat; }
.headerbar {
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}

[Wander Aline]

nao e possivel que ninguem saiba como deixar a imagem que fica de baixo do logo no tamanho do forum independentemente de qual resoluçao de monitor estiver visualizando o forum igual o logo desse ajuda forumeiros (forum dos foruns) por favor

[Sir_Undead]

Bem, eu posso te ajudar exatamente no que precisa.
Acesse Painel de Controle Visualização Imagens e Cores Cores Folha de Estilo CSS

Cole o seguinte código lá e salve:

Código:

#logo-desc img {
    width: 100% !important;
}

(apague o código que o Daemon sugeriu)

Explicando como funciona para que a imagem fique sempre na largura máxima independente das dimensões do monitor:
Suponhamos que a imagem de fundo tenha 1300px, e você não determina no CSS a largura dela. Então a largura da imagem será de 1300px. Agora, se você determinar no CSS que a largura será 500px por exemplo, então a largura dela será 500px mesmo ela tendo 1300px. O navegador irá carregar a imagem de 1300px e irá redimensioná-la à 500px. Até ai tudo bem.
Agora, como você faz pra deixar a largura máxima independente das dimensões do navegador?
É simples na verdade. É só você usar porcentagem! Vejamos:
Se você usa 100% de largura, quer dizer que tal imagem terá 100% de largura baseada no tamanho da div onde ela se encontra. O tamanho da div em que ela se encontra pode ou não mudar variando a largura do monitor.
Outra coisa, se você tiver uma imagem com pouca resolução e mandar ela ocupar 100% de largura, então em monitores maiores a imagem ficará em péssima qualidade. Com uma largura de pelo menos 1400 ou 1600px, você já tem um bom resultado em qualquer monitor.


O código resultou? Não esqueça do Joinha

[Wander Aline]

Mano uma palavra pra definir vc FODASTICO!
muito obrigado mesmo resolveu meu problema

[Sir_Undead]

Obrigado!
Fico feliz em ter ajudado.
Uma informação que esqueci de dizer, se quiser testar seu fórum em resoluções diferentes, há sites que fazem isso:
http://www.comofazerumsite.com/design/testar-resolucoes-de-tela.html

Até mais.

[Wander Aline]

vlws mais ainda