Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ (HTML) Text Disappears when I hover over a button

Posted by: Oscar Jun 20 2019, 11:35 AM

Hello, I'm having a bit of trouble with some HTML code.
Everything looks and functions fine, except when I hover over the button.

If the cursor is over the text in the button, then the text is visible.

But, if it's not over the text, then the text is invisible.

Any tips on how keep the text visible at all times while hovering over the button?
Here's the code: https://www.w3schools.com/code/tryit.asp?filename=G594BTR3OTJK

Thanks,
Oscar

Posted by: pandy Jun 20 2019, 01:21 PM

It behaves a little differently in different browsers, but some of the styling doesn't work because of errors in HTML and CSS. If you fix the errors it should work in SOME browsers, I think.
https://validator.w3.org/
https://jigsaw.w3.org/css-validator/

Especially the following errors.

You have two style blocks (why?). You haven't closed the first one, there is no end tag for STYLE.

None of the links are correct. In button1 you close the link with a start tag for A instead of an end tag. In button2 there isn't even an attempt to close the link.

But even if you correct the errors you have to rethink this. Because BUTTON can't contain A. In plain English, you can't put a link in a button.

Posted by: sarusaytooloud Jul 4 2019, 04:18 AM

Thanks, pandy for such an excellent answer..It was helpful for me..Keep up!