Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I am trying to implement a z-index on a menu sub-item show that it appears to be on top to the footer but i cant seem to get it to work. And im have trouble especially on mobile devices for menu items lower on the screen.
How can i solve this. Here is a link to the site
try this
#ef-footer {
bottom: 0;
left: 0;
line-height: 1.1em;
right: 0;
/*z-index: 35;*/
}
You need to set z-index:0; on the footer or just delete that z-index.
#ef-footer {
position: fixed;
z-index:0; /* add this */
}
Related
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
After checking examples and trying one of them for myself, I have realized that there's a blank hole that appears under the sidenav. It's probably not related with sidenav, but after you click the menu icon on the top-left most corner, (after sidenav opens) there's huge blank hole appears at the bottom of the page and I couldn't find the reason for that behaviour.
Here's the stackblitz link for that:
https://stackblitz.com/edit/angular-material-sidenav-generate-nav
Thanks for any explanation, have a good day.
you missed to add css to your <mat-sidenav-container> like in Material example :
.example-container {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: #eee;
}
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I'm trying to center a div with search bar. I tried position: absolute with main div position: relative. But did not got I wanted. It should go under the text. This is made with Bootstrap 4.
This is what I tried s far.
JSFiddle
Remove the top: -114px; of .search-sec and the position: absolute; of .search-align and add justify-content: center; and it works.
See https://jsfiddle.net/aqcredw2/
Oh, and .fixed-top should be better position: sticky; :)
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
You can find the staging environment over here:
http://axces-staging.houston-1.hybridmedia.be/
I have a lot of unnecessary spacing above the title "Onze aanpak".
I only have this issue on Firefox. It looks fine on chrome and safari.
Cannot find what causes this. Does someone have any idea?
Thanks.
It's due to two values in the elements above that space:
1.) The top: -30rem in homepage-middle__wrapper
2.) The margin-top: 30rem in section--products homepage-middle background--primary
Erase both to eliminate that space.
First of all, remove the negative value for top here:
.homepage-middle__wrapper {
margin-bottom: -27rem;
padding-top: 2.5rem;
position: relative;
top: -30rem;
}
Remove the margin-top here:
.homepage-middle {
margin-top: 30rem;
padding-bottom: 0;
}
At a padding top to the container or wrapper to achieve the same effect as before.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I've a static site made with html / css and there's a huge gap after the footer . I spent hours to find what the issue is , but I couldn't find . Down below is my Site .
http://ganidu-cyberholic.com/grill/
I've just checked your code. The Problem is you have used position:relative instead of position:absolute. Always remember that whenever you wrapping two elements in the html at that time use position:absolute
Make modification in your CSS like following:
.dotline {
left: 80px;
position: absolute;
top: -315px;
}
.dotbg {
left: -660px;
position: absolute;
top: -750px;
z-index: 0;
}
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 9 years ago.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
I am trying to get a slider that drops down from the top of my page to go over my menu but can't.
I have applied a position: relative to both of them and tried to put the z-index of the menu to 0 or -10 and I have but the slider to z-index: 10000 with it also postion: relative but it's still going behind the menu.
The page is at http://www.tassolarpanels.com.au/ and the slider in question is the blue "Get a Quick Quote" button on the top right of the screen. As you will see when you press it - it goes behind my menu.
If anyone has any ideas what I am doing wrong I would much appreciate your help!
You need to make sure that the parent element, in this case, #sliding-panel-container, has the correct z-index applied which it currently doesn't -- it is listed as z-index: 1 which is why it's showing behind the navigation listed as z-index: 2.
Try this:
#sliding-panel-container {
... /* Whatever your other CSS is here */
z-index: 3;
}
Add to your .site class:
position: relative;
z-index: 0;
#sliding-panel-container {
display: table;
position: relative;
width: 100%;
z-index: 9999;
}