Align DIV with Absolute position to another DIV with FIXED position

Question

Align DIV with Absolute position to another DIV with FIXED position

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I have a little problem here. in this website: link

I need to align this image slider to the top of the screen, behind the main menu.

As you can see, there is a black bar at the top. I put it with 10px height, but the idea is to leave it with 0px even (I just put it like this to see if it is in the right place)

What I need now is to position the slider pasted on this black bar. The slider is set to position: absolute.

How do I do this?

EDIT: Here are the codes below:

.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>

Other information: CMS: Wordpress Using Wp-Bakery (because the customer requested a site where they can easily update the list of products and downloads later).

html css

asked by anonymous 22.12.2016 / 16:52

2 answers

Angular http method: 'POST' is not sending the $ scope object Error comparing java strings

score 0 · Answer 1

Use position: absolute in the slider, and then change the top property (position of the element relative to the top of the document) according to your needs.

I noticed that you have put padding in your content (div where your slider is). In this case it is recommended that you remove the padding from this content, otherwise it will never reach the top of the page.

It's also interesting to remove the left you placed on your logo and modify the way you put it together. Try to leave it only within div instead of putting it in h1 . Then modify the values of margin-left and margin-top to put it in the position you like.

score 0 · Answer 2

The exact% div is with <header id="header" class="pagewidth"> and class position: fixed; with .metaslider

Everything will go up, but if you do not want to, you should use position: absolute; top: 0; z-index: 0;