How do I put bootstrap navbar ON hero image [closed] - javascript

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 am using the Hero Image example code from W3Schools and the Bootstrap Navbar, and they won't connect. Like there's a little space in between filled with background color. StackOverflow wouldnt let me post the code here because it was too long, so here are the links:https://www.w3schools.com/howto/howto_css_hero_image.asp
https://www.w3schools.com/bootstrap/bootstrap_navbar.asp
https://kalpact.repl.co

Your navbar has an explicit bottom margin, coming from navbar.less:.
.navbar {
margin-bottom: #navbar-margin-bottom;
}
Ideally, you should find where "navbar-margin-bottom" is defined and change it to 0. But... I've searched for that definition and can't seem to find it anywhere. You may have to just add this to your main stylesheet:
.navbar {
margin-bottom: 0;
}

Related

How do i get my footer to cover the whole width of the site? [closed]

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 3 years ago.
Improve this question
So, i came across some kind of bugg where my footer doesn't cover the complete width of the site anymore like its supposed to be in (image 2) how do i fix this?
How it is right now
How it's supposed to be
The footer is in div with class=container and id=hero and this is limiting it. Move the footer out of the div :D

How to get rid of this white effect on the page when clicking the scroll top button [closed]

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 3 years ago.
Improve this question
I'm currently working on this website http://www.test.yanosp.com/, but when I click the Back to Top button on the bottom of the page, the page gets white. How do I get rid of it? Thank you.
I inspected your pagetop__link class and found that in the "http://www.test.yanosp.com/wp-content/themes/lionmedia/style.css" file, where you define that class in the stylesheet, you have the following selector:
.pagetop__link:active::before {
background:rgba(255,255,255,0.9);
z-index:9999;
}
Get rid of the line background:rgba(255,255,255,0.9); and it should work.
remove .pagetop__link::before {position: fixed} solve the problem

Bug in Bootstrap carousel when click on next and back [closed]

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 6 years ago.
Improve this question
I have integrated bootstrap carousel but when i click on next and prev it shows some bug. Can someone help me what am missing ?
here is the link of website http://logmak.justevent.in/ please check 4 product slider.
You placed a function that changes how carousel behaves by default, just after you initiate it. That's what's causing your problem.
A quickfix would be:
.item.next.left {
display: none;
}
but there will be no transition from the old items to the new ones, at the end of the slide transition. My advice is to look for a carousel that allows you to set the step of the slide out of the box, such as slick.js.
(Not endorsing it, feel free to look for better alternatives. I use it because it's easy to style and quite small, pefect for my own needs. Your needs might be different.)

Why does z-index not work with sticky elements? [closed]

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 6 years ago.
Improve this question
I have some rollover effects in a sticky footer and a responsive menu / nav that sticks to the top. When the nav is opened and is long enough to go over the footer it covers everything except the rollovers.
nav closed http://www.musictheorytutorials.com/navclosed.png
nav open http://www.musictheorytutorials.com/navopen.png
I have tried lots of changes, searched on here and then tried to rebuild a simple version in jsfiddle as an example of it not working and it worked! However making these changes to my actual page do not...
Here is the jsfiddle that does work: /m_d_a/y7Lj3rms/26/
Here is rge jsfiddle that doesn't: /m_d_a/4bLyt681/5/
I can't get the code tags to work properly when cutting and pasting in either, sorry.
I know there is a lot of javascript, most of which is cut and pasted from linked js plug-in files which I don't understand, so I think it's gonna be something in there. If anyone can trudge through this I would really appreciate it. I will also change the title of this question to reflect a working answer to help people in the future.
Thank you.
just modify this selector in your css
from
.menu {
position: relative;
z-indez: 100;
}
to
.menu {
z-index: 100 !important;
}

Where is this image being generated on my webpage? [closed]

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 7 years ago.
Improve this question
I can't figure out where the chain link image is coming from on my blogger page (http://jareds94-wine.blogspot.com). Using Google Chrome's inspect feature I can see that it has something to do with hentry::before but it's not coming from the CSS so it must be coming form a javascript file right? Any help would be much appreciate as I'm trying to change it to another image.
It's not a bitmap image, but a character from the font awesome toolkit
.hentry:before {
content: "\f0c1";
z-index: 2;
font-family: FontAwesome;
}
Here \f0c1 relates to the character in the font which renders as a chain link
That "Image" is actually just a glyph supplied by FontAwesome.
It is being generated by your css like so:
.hentry:before {
content: "\f0c1";
z-index: 2;
font-family: FontAwesome;
}

Categories

Resources