little-finger | 自动部署脚本:nodejs,express server,小型自动发布系统,适合个人开发者使用 | Runtime Evironment library
kandi X-RAY | little-finger Summary
kandi X-RAY | little-finger Summary
自动部署脚本:nodejs,express server,小型自动发布系统,适合个人开发者使用
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of little-finger
little-finger Key Features
little-finger Examples and Code Snippets
Community Discussions
Trending Discussions on little-finger
QUESTION
I want to create an image gallery where parts of the image are hidden and get displayed when clicked on. My main problem is, how can I center the image that shows up after I clicked on the cropped image? These pictures may help understanding my problem.
This is my code so far:
...ANSWER
Answered 2020-Nov-02 at 10:57The images do in fact have a parent, they are in the DOM and are just referred to in the script. If you want to position them in the same place you can use position: absolute
like you've already done but need to also specify top: 0
and left: 0
to move them to the right place.
Note that position: absolute
will position the elements inside their closest parent that doesn't have the default position: static
property set. To anchor them in the same place, you can change their common parent .grid-container
to something else, like position: relative
. This will cause all child elements with position: absolute; top: 0; left: 0;
to be aligned to the grid container's top left corner.
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install little-finger
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page