White space below footer in safari [closed] - css

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.

Related

Bootstrap 4 strange margin under images [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 am getting a strange margin under my images.
I have set the margin/padding on both the containing div and the image to 0
This is the site i'm working on: https://www.philipnordstrom.com/
It is coming from your body font-size: 10px. If you change it to 1px the space between is gone. Try to add a css class like: div a { font-size: 0; }
You can see the link on the picture. I cannot tell you why this happens maybe because images aren't meant to be linked like this in the default case. I would need to dig deeper inside this to tell you the reason ;)

Background color and scroll issue. [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 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;}

How to make a picture to cover the width of a div [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 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%

css select :nth-of-child(1) not working [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
so im trying to make the first wide box under recent promotions (at the bottom) have a a bigger height than the rest of the boxes, however nth-of-child is not working, I just need it for that first wide box. here is the code:
#listify_widget_recent_listings-2 .job_listing-entry-header:nth-child(1) {
height: 400px !important;
}
When you remove the :nth-of-child it makes all the boxes bigger as expected in that widget so I am not sure why its not working for the first. Help!
please try this
#listify_widget_recent_listings-2 .job_listings li:nth-child(1) .job_listing-entry-header.listing-cover.has-image {
height: 400px !important;
}
comment please if i miss something

one class seems to block visibility of another? [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'm using the Semplice theme on a self-hosted Wordpress-site and have a problem with displaying the sub-menu.
I have only quite poor css-knowledge, but after hours of try & error I have managed to make the disabled sub-menu re-appear again - at least it shows up partly. According to the visual overlay of my browser the sub-menu items are there, but only one of them gets displayed, the rest seem to be blocked by a different class!?
I've attached a screenshot to show you what I mean?!
The submenu (vertical drowdown) sits under "units" and has six sub-nav items, but only one gets displayed, the others seem to be be hidden by the (hidden) responsive menu?!
I've tried the z-index but to no avail and now I'm really lost. I would greatly appreciate any help with this! Here's the site I'm working on:
http://s363619762.online.de/
You have the following style:
.navbar-inner {
height: 131px;
overflow: hidden;
}
Remove the overflow: hidden; and it should work (This is just a solution for the current problem, don't know it it affects other places)

Resources