Making adjacent container sticky [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 4 days ago.
Improve this question
I have a container which consits two child containers. the left one is a lengthy one and the right one is a bit lengthier than the viewport. when i scroll down the right containers end should come into viewport and stick there until i reach bottom of the left container and then both containers should scroll together.Any idea on implementing this?
I tried some solutions with calculating height,but couldn’t get what I need.

Related

Display a div above a grid grow [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 last month.
Improve this question
I have a display grid with multiple rows and multiple columns, I am trying to make a div display when I hover over one of the grid boxes, but right now it is being cut off by a grid row. I want it to lay over the design.
I have tried position: absolute and z-index, but that does not seem to work. What other ideas can I try?
in addition to using absolute and z-index you should probably position the div you want to display over the others in the largest parent div. If you are able to provide your html and css I can be more precise

Domino layout - overlapping boxes [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
Sandbox:
https://codesandbox.io/s/nostalgic-wozniak-mci9l
I'm trying to reproduce an effect similar to the following (with a fixed spacing between each tile):
I almost have the right effect, but as you can see on the sandbox, the boxes are overlapping the further down the right they get. My maths are probably off somewhere, but I don't see where.
Here's what I thought would work:
My implementation didn't take into account that the increment by which each box had to be moved wasn't the domino width, but rather a new amount defined by the following relation:
I discovered it by completely omitting the domino width from the increment, only leaving the margins: the dominos were perfectly aligned on the left side, meaning that the alignment problem on the right side could only come from the width increment.

Irregular bootstrap3 grid, one column out of container [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 5 years ago.
Improve this question
I'm seeing some crazy layouts sometimes. One of them is layout where we have boostrap container that has max width, let's say 1120px.
One of columns has 50% width of container, and the second has 50% width, not container but browser.
I've attached 2 screens to clarify my question - and the question is: does anybody has claver solution, that is responsive and will not break things during resisizing ?
So, 2 columns will not collapse ?
I will not provide html / css code, as i have no idea, how to code this right and without javascript.
If any of You have any ideas, i'm saying "thanks for a tip :)"
you can use width: calc() to calculate any width you want.
quick example
https://codepen.io/kupas/pen/Yepadv
PS: for smaller screen use mediaqueries

how can avoid horizontal scrolling? [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 8 years ago.
Improve this question
My website scrolls left and right and i can't find why? can anyone help me? this is the link
http://snf-36202.vm.okeanos.grnet.gr/eud/index2.php
Because div's are by default 100% width.
If you change them to display:inline-block it'll be fine because they'll have the width of their content then.

how to make a div floating fixed on the after scrolling to a point [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
this is the example, the left Nav div can float on the top once hitting to a point when scrolling down
http://www.codecademy.com/glossary/html#attributes_class
Look into WayPoints jQuery plugin... I use it, and it does very nice things!
http://imakewebthings.com/jquery-waypoints/
Once you hit the div that reflects the glossary, you could make jquery search for the 'selected' link, remove the link class from it, and set the class to the new link. It would take a little time to make it work perfectly, but would do great.

Resources