Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 4 years ago.
Improve this question
So , I have gotten a ticket from a client saying that he has some extra space after the footer end,i looked into it and it's true,basically,after the HTML ends there are a good few scrolls of plain black space. I tried giving the html doc a height of 100% and body a min-height:100% ,but it doesn't work.
It seems that the overflow of the div class="page-width" in the footer class="site-footer" is causing this issue. Set the css property overflow: hidden; to resolve the issue.
The implemented change:
.page-width {
overflow: hidden;
max-width: 1180px;
margin: 0 auto;
padding: 0 10px;
}
There is something that is shown from the dev tools that you have included in the HTML tag and has classes as follows html.js.svg.supports.csstransforms.csstransforms3d.csstransitions.shopify-features.__smart-payment-buttons--enabled.gr__virtualbabylon_com that has a dimension of 1349*2357.11. One of those classes or a combination of them generate that height of 2357.11. That is where you should start looking at.
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 3 months ago.
Improve this question
fixed div through position:sticky and after scrolling navbar which is fixed overlaps div. How can this be fixed?
Navbar from bootstrap
I am new to frontend, so I used only padding, but it does not look nice, everything is not flat in relation to other blocks
I am new to frontend, so I used only padding, but it does not look nice, everything is not flat in relation to other blocks
You can use z-index property in CSS, imagine you have 2 divs, div-1 which has it's position sticky and and div-2
the code would be:
.div-1 {
position: sticky;
z-index: 0;
}
.div-2 {
z-index: 1;
}
I didn't understand what you want please write your code here, before that try the code below and see its work or not
* {
padding:0;
margin:0;
box-sizing: border-box;
}
#your-id-name-for-navbar{
z-index:99;
}
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
help, I created a card with a button in it, in the card section I used the css property pointer-events: none; so that the button cannot be clicked because of that property, can I click the button without deleting the property pointer-events: none;
thank you
you can do that with the help of bootstrap, you need to give a mentor column class col-sm-12 and rest of the icons class col-sm-6
You can use #media queries to set the width and height of each icon.
#media (max-width: 786px) {
.icon1{
width: 30px;
height: 30px;
}
}
Media queries are useful when you want to modify your site or app depending on a device's screen size. Now the above css will work if the maximum size of the screen is 786px
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
Is it possible to make the trimmed borders by "border-radius" unclickable, and also not detecting you are hovering over it?
One way is to make the wrapping div and a tags also have a border radius...
.blackground > div, .blackground > div a {
border-radius: 100%;
}
.blackground > div a {
display:block;
}
The trick is to make the <a> tag the one whose size changes, because that's the element that determines the click area.
So you can do
.backgroud > div > a {
display: inline-block;
border-radius: 100%;
overflow: hidden;
}
Then remove the border radius (if you want) on the actual image.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I want to set transform: translate(50px, 25px) from JavaScript (I want to calculate 50 & 25 coordinates) to element <div id="foo">bar</div> and to inherit from CSS #foo { transform: scale(.8) }.
I explicitly want to have scale defined in CSS.
I would like to know if it's possible to override only one type of transform from JS without overwriting whole transform property. (example: like with margins; if you set in CSS margin: 10px 20px 30px 40px; you can directly access margin-top and change it without affecting other 3 sides).
You need to use window.getComputedStyle to read styles from CSS file. Read current transformation and apply with new one.
See how this works there:
http://jsfiddle.net/Lcjb5vLd/
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Maybe there's an easy answer, but I don't know it. I know you can float right, but is there anyway to position something at the bottom of a box?
You can use absolute positioning. Absolute positions relative to its first positioned ancestor. If there is none it defaults to the document. So I gave it a parent with relative.
http://jsfiddle.net/DSpkv/
#parent { position: relative }
#foo { position: absolute; bottom: 0; right: 0; }
<div id="parent">
<div id="foo"></div>
</div>