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
I am working in a CMS based project where I have a left side navigation and content area.
While I click on the menu for first time, it works as expected i.e clickable but If I click for the second time,it(i.e the link) did not work as expected.
Let me give you the link ,
visit sandbox
Note: In index2.html there is a class called main-wrapper, now when I remove that class , the navigation works perfectly.
Please tell me how to fix this problem.
Include the below css in your css file or in inside head tag and your sidebar will now work.
.main-wrapper-dashboard .sidebar {
z-index: 9999;
}
Your main sidebar had been overlapped by the secondary sidebar in index2.html thats why you were not able to click the links.
By looking at your page I observed that main-wrapper main-wrapper-pages come over main-wrapper main-wrapper-dashboard so you can not click on main-wrapper main-wrapper-dashboard so try to add z-index to that:
.main-wrapper.main-wrapper-dashboard {
z-index: 100; //any value more than 10
}
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 4 years ago.
Improve this question
I am trying to set my logo in between the menu. I am able to add logo but not able to make it work properly. My logo shows in a single line but all the other menu items show in a line. I want to show the whole menu in a line. Here is my website link: http://savourthemoment.fr/home
Thanks in advance for your help.
There are two modifications to be done.
1. The link which contains your image element is 1040 px wide. I changed it to:
a{
width: 104px;
}
However its better to reference it using an id or class rather than using the anchor tag as it will manipulate width of all the anchor tags.
The width of the image is set at 10 %. Change it to a 100% so that it occupies the entire width of its parent element.
img.savour-home-logo{
width:100%;
}
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 5 years ago.
Improve this question
I'm trying to find out how to write this function but I'm not sure what it is called and where I can find one for an example. I'm a beginner so I'm only familiar with HTML and CSS.
It's NOT a dropdown bar. It's a text that you could click and when you click it, it immediately shows another body of text right underneath it. It does not involve loading anything, as if it is already there. It is immediate. I want to have something in my website where if I have a name of something, there is an arrow by it that says "details" and when you click it, it shows a whole body of text with details. This button typically seems to have a small arrow next to it. Again, it is not any type of menus or bars, it shows a whole body of texts or images.
It sounds like you want to show a hidden element. This is a very basic example, look into jQuery show() & hide(). You're essentially setting the display:none CSS rule on the hidden text to something like `display:block'.
$('#foo').on('click', function(){
$('#text').show();
});
#text {
display:none
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Details
<div id="text">This is a test message for the text.</div>
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
Could anybody please suggest me a way to move the sidebar menu on this website to the bottom of the page: http://rencontresduvietnam.org/conferences/2016/search-for-life/ ?
I have played with CSS for a while but haven't got expected results :(
Thank you in advance!
Update
I tried the following as suggested by #Souljacker:
.sidebar-container {
position: static!important;
}
and as suggested by #c-travel:
.site-main .sidebar-container {
top: auto;
bottom: 0px!important;
}
The sidebar was moved to the bottom but it's ugly:
Is there a way to limit it to the end of the text?
Thanks.
You have couple of options.
Create the hook for the menu.
Change the menu in the template.
If you change it at your template files (the easiest) you have to go to your theme's folder and find for
sidebar.php
There must be the code that enables your menu to show up on your sidebar...
Mostly themes have the parts isolated, and the bottom should be on the file footer.php , if you are looking to insert it at the footer part, then you can just paste the code there... should work
.sidebar-container {
position: static;
}
This will get it back to the normal code flow.
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 am developing a website where I have a top menu and a background image with some text on the home page. This covers the whole screen. BUT at the bottom of the screen there have to be 3 blocks who show up at the bottom of any screen or device. I am able to to this for Chrome but for Firefox for example the blocks are way far down at IE the same... What I want:
I am currently doing applying following code on the div containing the 3 blocks:
position: relative;
top: -150px;
But as mentioned above in another browser this div shows up to low so the user won't see it until he scrolls...
Any solutions here?
Simple change:
position: fixed;
bottom: 0;
Better idea to wrap it inside another <div class="bottom-stuff"> and give the rules to .bottom-stuff.
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 was wondering if anyone knows why I can't click the "Get Directions" link at the top of the page.
http://progressivespineandsports.com/
There is a target of blank attribute on the link but I don't think that this has anything to do with the link not working.
add
.block.header {
position: relative;
z-index: 1;
}
to your css, for a quick fix.
The problem is that the #content div lays upon/above your header div.
Because div.block.header has a height of 0, all its children are float. So div#content stacks above the link, prevents you from clicking the header link.
Add overflow: hidden to div.block.header, or other clearfix tricks.