Comments (7)
@web-tiki i remember this happening before some times. Its a floating point rounding issue with some sizes.
@costincca if i remember correctly this happend in only specific browsers, and it is a single pixel. You can try to tweak the math with higher precision, or you can try to blur the curtain element to make the 1 pixel difference less visible.
I would also advice to have a little room for error, especially when its a single pixel line that shows up some of the time.
from responsive-grid-of-hexagons.
Hi @poi33 I do not understand yet how the curtains are calculated. I need to use a Dev Web Tools from Chrome or Mozilla to check the elements. I started to explore the possibility to freeze the hexagons at a certain size (where the curtains look well) and change only their number per line.
Or calculate the top curtain as 50% and the bottom curtain at "bottom - size of the top one", thus having just one round operation and the second one filling in the remaining of space.
from responsive-grid-of-hexagons.
@web-tiki is there some calculation we can increase the precision on to avoid this?
from responsive-grid-of-hexagons.
@poi33 I don't have time to make a fix for this bug just now but the tests I made reveal the calculation bug comes from the transform
property on the h1
and p
element in the hexagons.
from responsive-grid-of-hexagons.
Hi @poi33 I do not understand yet how the curtains are calculated. I need to use a Dev Web Tools from Chrome or Mozilla to check the elements. I started to explore the possibility to freeze the hexagons at a certain size (where the curtains look well) and change only their number per line.
Or calculate the top curtain as 50% and the bottom curtain at "bottom - size of the top one", thus having just one round operation and the second one filling in the remaining of space.
Hi, have you figured out now how do the curtains close properly, I imported bootstrap and and curtains can't shut, there's big gap in between
from responsive-grid-of-hexagons.
i would like to work on this issue please assign to me
from responsive-grid-of-hexagons.
i would like to work on this issue please assign to me
Done !
from responsive-grid-of-hexagons.
Related Issues (20)
- border HOT 4
- Grid not displaying on Chrome Mac 56.0.2924.87 (64-bit) HOT 2
- How to make hexagons flat-topped HOT 1
- Hexagon area question or so...? HOT 3
- Less hexagons on odd rows HOT 2
- Hover effect broken HOT 2
- [Question] Using the hexagrid in a div HOT 9
- Hover effect won't close HOT 7
- border instead of background color ? HOT 2
- Fixed height and width hexagons HOT 5
- Blurry Text on hover HOT 15
- How to Replace images? <img src="https://farm8.staticflickr.com/7187/6895047173_d4b1a0d798.jpg" alt="" /> HOT 6
- Responsive grid of hexagons not working with Cold fusion header/footer on site HOT 7
- Border and/or Shadow HOT 3
- Using Grid instead of Flex HOT 2
- Show h1 underneath image HOT 2
- Is this repo still maintained? HOT 5
- Increase the spacing between hexagons HOT 1
- Indentation on first row and how to increase the space between hexagons HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from responsive-grid-of-hexagons.