Feedback on Improving CSS-Only Crossword - with JavaScript

Improving CSS -Only Crossword-with Javascript
Part 1 of 8

Thanks.

The three dots means that thereā€™s more code in that section that hasnā€™t changed, which has been removed from the displayed example for the purpose of not showing an extremely long section of code. The condensed version makes it easier for people to understand what I have have been talking about and how it all connects together in the code.

No, thereā€™s just other stuff in that tag that is not related to what Iā€™m talking about there.

The full HTML code for that element is much longer and more complex.

<input id="item1-2" class="crossword-board__item" type="text" minlength="1" maxlength="1" pattern="^[hH]{1}$" required="required" value="" />

Improving CSS -Only Crossword-with Javascript
Part 1 of 8
So does the html code for each element go where the three dots are.

The three dots mean that the code remains unchanged from what there was before.

So what part of the code goes where three dots are

What goes there is exactly what was there before in the code.

1 Like

Can you link this j JavaScript gold to html and css page

Iā€™m not sure what you mean by ā€œJavaScript goldā€.

Oh, is it supposed to be code instead of gold?

Sorry, can you link this javascript page to html and css.
Sorry computer typed what it wanted.:blush:

The codePen page gives you several different ways to access the html and css code.

At the bottom of each post in the Improving CSS-Only Crossword - with JavaScript thread I have linked to a different codePen page that includes all of the updates from that post.

What does (/(\d+)-(\d+)/ and /^\w$/ mean?

Those are regular expressions,. The first is two capture groups for digits separated by a hyphen, and the second is that the whole string is a single word character.

Can you help me to get " Well done, champ" to display. I have the div class crossword -complete in the html as well as the css properties that are in the codepen and the message still does not display. Is there something missing?

It works for me both on the original CSS-Only Crossword and on my part 8 of 8 update.

It seems that the original creator of the CSS-Only Crossword uses a CSS technique for showing congrats, that doesnā€™t work on Edge.

Do you know of another way to display a message or show a congratulatory message in css?

Edge has been updating its abilities quite rapidly. Iā€™d wait for Edge to support the CSS standards that are being used.

Ok just let me know