Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chessboard doesn't fit container completely #242

Open
kenneth-venken opened this issue Apr 23, 2023 · 1 comment
Open

Chessboard doesn't fit container completely #242

kenneth-venken opened this issue Apr 23, 2023 · 1 comment

Comments

@kenneth-venken
Copy link

I have a container element of width 600px which could support a board with 8 squares of 75px. Yet the board is only 592px wide with squares of 74px.

Looking at the code i noticed...

// calculates square size based on the width of the container
    // got a little CSS black magic here, so let me explain:
    // get the width of the container element (could be anything), reduce by 1 for
    // fudge factor, and then keep reducing until we find an exact mod 8 for
    // our square size
    function calculateSquareSize () {
      var containerWidth = parseInt($container.width(), 10)

      // defensive, prevent infinite loop
      if (!containerWidth || containerWidth <= 0) {
        return 0
      }

      // pad one pixel
      var boardWidth = containerWidth - 1

      while (boardWidth % 8 !== 0 && boardWidth > 0) {
        boardWidth = boardWidth - 1
      }

      return boardWidth / 8
    }

... a fudge factor of 1pixel. Or something like that. Why is this? Wouldn't it be cleaner if the board fits the container completely if possible. Could you please change this behaviour?

@daqnal
Copy link

daqnal commented Jul 7, 2023

I'm experiencing the same. The slight margin is very noticeable on some sizes. When I make the viewport smaller, the extra margin gradually disappears then reappears once it hits some point, maybe the width of mod 8 from the code above.

img

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants