See post 10. Nothing worked for me, I tried numerous solutions in code tags.
Agreed. The problem is that space characters are handled differently in different browsers, so there will not be one solution that works in all browsers. Spaces are not treated as characters, so they do not get the same rules in fixed width fonts as characters.
This is the only thing that works on my screen, Chrome. It displays perfectly aligned, and has the benefit of grid lines. The only problem is that it is not as pretty in the edit window, when trying to compose the board layout. However, that is typically an issue any time I try graphics or tables on the board. Use Preview Post generously.
Yes, that is pretty much the only solution that will work for all.
On my machine, those demonstrate the problem with trying to use non-aligning rows. Is the pawn in row 3 directly under the empty spot in line 2? On Chrome, that pawn is directly below the gap between Queen and Bishop, offset from the pawns in line 2 by being moved over left a column and a half. It requires careful counting of spaces and makes quick visualization a challenge. For people who are spatially challenged, that might be an issue.
Interestingly, in the edit window those look great. I guess that’s what they look like for everyone else.
So, I would suggest that is a workable solution, and anyone using Chrome could quote the post to see how it appears for easy study.
It’s because the empty space in line 1 for the knight. Just like line 3 doesn’t match lines 4, 5, and 6.
☐ ⛶
a. b c d. e. f. g h
♜♞♝♛♚♝♞♜|8 |7
☐☐☐☐☐☐☐☐|6
☐☐☐☐☐☐☐☐|5
☐☐☐☐☐☐☐☐|4
☐☐♘☐☐☐☐☐|3
♙♙♙♙♙♙♙♙|2
♖☐♗♕♔♗♘♖|1
a. b c d. e f. g h
♜♞♝♛♚♝♞♜|8 |7
⛶⛶⛶⛶⛶⛶⛶⛶|6
⛶⛶⛶⛶⛶⛶⛶⛶|5
⛶⛶⛶⛶⛶⛶⛶⛶|4
⛶⛶♘⛶⛶⛶⛶⛶|3
♙♙♙♙♙♙♙♙|2
♖☐♗♕♔♗♘♖|1
These pages have links to various chess fonts. I think some of them have characters for constructing the board etc. as well as the pieces. I haven’t tried any of them.
The code is apparently at http://pgn4web-project.casaschi.net/ but this is on Sourceforge which is currently having problems. I would think the geeks at Sourceforge will have it fixed soon.
I meant none of the new examples worked. The following three old examples work for me on Win7 Firefox. (The letters are very slightly off, but not enough to be a problem.)
davidm that would be ok if the idea was to find ways to display a chess board, but the challenge here is to find an available font in our message board. And a simple way to display a chess position by cutting and pasting pieces. And this is because new scripts to use in the SDMB are usually not welcomed unless they come standard with the current vbulletin forum software.
**BigT ** the problem with Tabby_Cat’s idea and others is that the code would become hard to manage to hide the pieces that are in place of the “squares”, I do see however that by moving the numbers to the right that is making the alignment easier, I will experiment more until I find an easy to edit mini chess board to show positions and that it works in several browsers. (It is not intended to be used to play an actual game, except maybe a “mail” chess one).
Post 66 looks good in IE11 on Win8.1. The letters aren’t perfectly aligned, but they’re close enough there’s no potential for confusion. The chess pieces and empty box placeholders are perfectly aligned. This also works right under differing browser zoom levels and/or when using pinch/spread window zoom.
But …
Post 66 doesn’t look so hot on a Winphone8.1 using tapatalk. The spaces between the empty box placeholders is narrower than that between actual pieces. For a completely empty row the h column placeholder box is below the g7 pawn, and the numbers 6, 5, 4, & 3 are pretty much directly below the h7 pawn.
As well, the a-h labels are also misspaced. IOW, they are aligned almost directly above the closely spaced placeholder rows, not the wider-spaced rows with 8 pieces.
And of course any row of mixed place holders and pieces has intermediate levels of spacing problems.
Using the same Winphone8.1 but accessing SDMB via IE the problem is similar to tapatalk’s. The difference in horizontal spacing is a bit less, so the 6, 5, 4, & 3 labels are now a bit to the right of the h7 pawn, but not as far right as the pipe character.
As somebody said upthread, this isn’t gonna work until you find a fixed-width font with chess pieces that’s already available on every device.
At this point I wonder if you wouldn’t do better to switch to using the letters KQRBKP for the pieces. Then all you need is a universal fixed width font with that, spaces, underscores (or boxes) and pipes. That is a much lower tech hurdle.
Late edit: Replace similar paragraph above with this:
Using the same Winphone8.1 but accessing SDMB via IE the problem is similar to tapatalk’s. The difference in horizontal spacing is a bit less, so the 6, 5, 4, & 3 labels are now a bit to the right of the h8 pawn, but not as far right as the pipe character.
On tapatalk on android phone, all three in post 65 work. The letters don’t align, and the blue box is more aesthetically pleasing as it is easier to distinguish as a void instead of a piece. Post 66 does not align well.
Interestingly, the one with the dashes I referred to in my previous post that didn’t work in chrome looks great on tapatalk.
a b c d e f g h
♜♞♝♛♚♝♞♜|8 |7 ︎❑:black_medium_square:︎❑:black_medium_square:︎❑:black_medium_square:︎❑|6
❑◼︎❑◼︎❑◼︎❑◼︎|5 ︎❑:black_medium_square:︎❑:black_medium_square:︎❑:black_medium_square:︎❑|4
❑◼︎♘◼︎❑◼︎❑◼︎|3
♙♙♙♙♙♙♙♙|2
♖❑♗♕♔♗♘♖|1