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 need some help here. My final project is due tomorrow and the mobile responsive view of the app is completely off. I don't know how else to explain it other than just giving you the link to the URL.
https://venpresath.github.io/FinalProject/#!/home
It appears that the animation that I put onto the spinning record is making the width of the screen larger than the background is.
I tried overflow: Hidden; but it didn't correct the issue.
One work around is to hide the overflow of the record, something like:
.homeContent{
overflow-x: hidden;
position: relative;
}
Try placing overflow: hidden; directly on the body tag, this should ensure that whatever happens in the content the body shouldn't scroll horizontally.
you can use transform scale and transform origin css. please add below css. this is the demo http://recordit.co/UK63B2vKiR
.homeContent{transform: scale(.8, .8);}
body{background: darkslateblue!Important; overflow-x: hidden;}
*{max-width:100vw;}
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
On the mobile version of the website, you can scroll to the right to the navigation, which should actually only be accessible via click. How can this be changed?
(URL removed)
I have already tried many different solutions that I have found, but nothing works so far.
I am looking for help in this individual case.
Thank you very much :)
By moving your .main-nav element with transform to the right you extend width of the visible content, and since your scroll properties are default it will enable you to scroll the entire visible content, including that menu.
What you want to do is clip everything that is outside of your html or body element.
CSS
html {
overflow-x: hidden;
}
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
when ı set the position: fixed; div is disappearing so what can ı do
Before code
Before Page
After code After page
I think I know what happens, for what I can see from the screenshots.
Why?
This happens because when you set a element 'fixed', their position is not relative to their parent any more. It is relative to the html document. You could also say it is taken out of the 'normal' content/document flow.
Since I miss some information on what you would like to achieve, a suggestion is using the value 'sticky' in the property 'position'. This will keep it inside the flow of the document and is 'fixed' relative to their parent. IF you want to achieve this and I would suggest reading into it because using it can be tricky.
Example:
.container {
width: 100%;
height: 90rem;
}
.container-child {
position: sticky;
top: 0; /* Needed, because this way you'll let the browser know when to get sticky when the viewport(top) of the user 'touches' the element. */
}
Source: MDN position: sticky
Beware that the browser support is limited or quirky in some browsers.
I would also suggest setting a codepen example for your problems with a description of the expected behavior. That makes it easier to understand and replicate your issue. ;) https://codepen.io/
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
On this website I would like to fit the picture for the entire div width.
(If you scroll down you'll see the blog section)
As you can see from the picture there are some white space on left and right.
How can I achieve this?
Note: I can't edit the HTML structure of the website. I can only work via CSS or JS.
Many many thanks
You only have a max-width: 100%- So if you set width: 100% it'll work, like so:
img.scale-with-grid, #Content img {
max-width: 100%;
height: auto;
width: 100%;
}
As can be seen here (updated css in chrome devtools.)
Just give img.scale-with-grid, #Content img : 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 7 years ago.
Improve this question
this is for safari.
This is my test website: "http://warmfarewells.org/plumber/" I had this problem in Chrome as well, but I used this code and white space since disappeared. The only problem now is that it is still visible in safari.
#cye-workaround-body-image {
height: auto !important;
}
#cye-workaround-body {
height: auto !important;
}
I have tried everything I can think of, but nothing seems to be working.
PS: I am using Mixit javascript for gallery, when I remove it, both gallery and white space disappears. But I want to keep gallery, and want to get rid of white space. Thanks
Add this to your CSS:
footer {
overflow: hidden;
}
The problem is your image animation in the footer.
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
My overlay of one div into another is not working. When i click on login button it show ul . which is on back of another div which having background
Does anybody help me?
Here is website link here is link
and here is
Add z-index:9999 to .navbar.navbar-fixed-top in css
edit
Add this class to CSS .region-topheader and assign it z-index:9999; position relative
It's problem with z-index. Try adding this css:
.navbar.navbar-fixed-top {
z-index: 4;
}
.region.region-topheader {
z-index: 8;
}
Your drop down has z-index of 1030 and baner has a z-index of more then 1030 thats the reason you are not able to see it, if you give your baner a z-index of 1000 then it should work.