Resolved Issue with Image Overlapping on Processing.org Examples Page #514#538
Resolved Issue with Image Overlapping on Processing.org Examples Page #514#538Lavanyaa09 wants to merge 1 commit intoprocessing:mainfrom
Conversation
✅ Deploy Preview for java-processing-faf822 ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
Thanks for your contribution @Lavanyaa09 ✨ Appreciate you taking the time. I'm noticing that the changes (right side) are applied globally across breakpoint sizes. It may actually work a the medium size but it breaks on mobile. See the screenshots below:
|
|
Hello @SableRaf, I am pleased to inform you that the updates are now successfully functioning on the web interface globally. I will proceed to work on optimizing the mobile view and will merge the changes accordingly. Thank you for your guidance and support. |
Stefterv
left a comment
There was a problem hiding this comment.
The changes work so they could be merged, but I think there might be an opportunity to fix the issue with more sustainable approaches
| position: fixed; | ||
| top: 130px; | ||
| right: var(--margin); | ||
| right: calc(var(--margin) - 1cm); |
There was a problem hiding this comment.
centimeters have not been used yet in the codebase, please use some of the constants in the variables.css
|
|
||
| .item { | ||
| flex-basis: calc(100% / 5); | ||
| flex: 0 0 calc(25% - 2 * var(--gutter)); |
There was a problem hiding this comment.
The fix works, could you research if you could scale the container element instead?
|
@Lavanyaa09 If you're still interested in this PR, could you take a look at the comments above? Thank you for your contribution! |


I have observed an issue in example page of processing website where i resolved the issue by using 4 columns instead of 5 at the largest width on the examples page, leaving space on the right.
processingwebsitechanges.pdf