-1

Estou com um pequeno problema aqui. neste site: http://www.gncshop.com.ar/portal/company/

Eu preciso alinhar esse image slider a parte superior da tela, que fique por tras do menu principal.

Como podem ver, existe uma barra preta, bem em cima. Eu coloquei ela com 10px de altura, mas a ideia depois é deixar ela com 0px mesmo (só coloquei assim para ver se ela esta no lugar certo)

O que preciso agora é posicionar o slider colado nessa barra preta. O slider esta setado com o position: absolute.

Como faço isso?

EDIT: Seguem abaixo os códigos:

.upperfixedbanner {
position:fixed;
top:0px;
width:100%;
height:10px;
background-color:#000000;
}

.upperfixedbanner > .sliderhomepage {
display:block;
  position: absolute;
width:100%;
top: 0px;
margin-top:0px;
left:0px;
}
<div class="upperfixedbanner">
</div>

<div class="sliderhomepage">
<!--SHORTCODE DO SLIDER-->
  </div>

Outras informações: CMS: Wordpress Utilizando o Wp-Bakery (pois a cliente pediu um site em que ela possa atualizar facilmente depois a lista de produtos e downloads.)

2 Respostas 2

0

Use o position: absolute no slider, e em seguida altere a propriedade top (posição do elemento em relação ao topo do documento) de acordo com a sua necessidade.

Percebi que você colocou um padding no seu content (div na qual está o seu slider). Neste caso é recomendável que você retire o padding deste content, caso contrário nunca irá alcançar o topo da página.

É interessante também remover o left que colocou na sua logo e modificar a maneira com que você a montou. Tente deixá-la apenas dentro de uma div ao invés de colocá-la no h1. Depois modifique os valores de margin-left e margin-top para colocá-la na posição que te agrada.

9
  • No momento esta assim: 22/12/2016 às 16:29
  • .upperfixedbanner { position:fixed; top:0px; width:100%; height:10px; background-color:#000000; } .upperfixedbanner > .sliderhomepage { position: absolute; width:100%; top: 0; } 22/12/2016 às 16:29
  • Dá uma olhada nesse modelo simples que fiz aqui: jsfiddle.net/e7mga97m 22/12/2016 às 16:44
  • Só precisa trocar a imagem da paisagem pela div com o seu slider. 22/12/2016 às 16:48
  • Mas essa forma que você usou, funcionaria em um site feito em wordpress? Em que, por exemplo, toda e qualquer informação que eu coloque em uma página ficará dentro do "content" da página, salvo se eu especificar outra localização. 22/12/2016 às 16:58
0

A div <header id="header" class="pagewidth"> precisa está com position: fixed; e a classe .metaslider com position: absolute; top: 0; z-index: 0;

Tudo irá subir, mas aí se você não quer isso deve-se usar position: relative; top: -102px; z-index: 0;

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .