Meme Monday!
Today's cover image comes from last week's thread.
DEV is an inclusive space! Humor in poor taste will be downvoted by mods.
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (91)
I published a new comiCSS cartoon, and it is number 100, so I'm happy 🥳🎉🎊💯
Also, please, never use a
<div>instead of a<button>.I'm not using them instead ov buttons — but is it fine to use
as asbuttons?@baenencalin In my opinion, you should use
<button>for a button, and not<a>. But the answer to your question is a "maybe?" as there could be exceptions.There are some situations (e.g. when a service like login or payment methods are handled by an external site) when it's a gray area what element should be used: semantically, it makes sense to style an
<a>to look like a button because, although they are punctual actions (login, payment, etc.), they redirect the website to somewhere else (the external service) and will eventually come back. It's not a one-size-fits-all type of thing. Once that's said, most of the cases I've found a<div>/<a>to behave like a<button>didn't fall on those categories, and they should have definitely been a<button>.Sorry for the long answer :$
If it is meant to be a button, it should be in the
<button>tag. If the button is meant to be a hyperlink to another page, place the<a>tag inside the<button>tag.@sarahokolo I wouldn't recommend that, as it will most likely end up being invalid HTML. An interactive element (
<a>with anhrefattribute) cannot be inside of another interactive element (<button>). (Reference)I'm not using the
ain thebutton— I am using theaas the button.I'm doing this for navigation-buttons specifically; the
as are styled to resemble normal buttons (and less-so with the ones on the navigation-bar).My website is an example ov what I am talking about.
It's fine — and appreciated.
@baenencalin the comment about
<a>inside of<button>was for Sarah. I tagged the comments to avoid confusions. Sorry for the misunderstanding.In the case of a navigation, it seems like a case for a link that may look like a button (although it is not, and won't have the
role="button") but it is still a link. Sorry, I couldn't see your page because it returns a 404.Weird.
Why would my DEV profile return a 404 when my account exists?
What about in the case ov page-navigation?
Data isn't being handled, it's a static site — but I believe I chose correctly.
Here's an interesting case of using
<a>as Button from Bootstrap current docs.From : getbootstrap.com/docs/5.3/componen...
This is rather interesting — stylistically, I can imagine an
<a role="button">looking good for collapsing or expanding content — in fact, I'm convinced there is at least one site that takes such an approach.It's not a matter of looking good. With CSS you can make a link look like a button, and a button look like a link, and they both will stylistically look good. Nobody would be able to tell which is which. The problem in this case is that collapsing/expanding content is an action and not a redirection. Yes, a
<a role="button">styled to look like a button will work, as a<div>would do, or a<span>or any other HTML element, but they are not the correct semantic element.The only time I've ever thought to use an
aas a button was for a login button in navigation, where the ask was for it to open up a modal on the page. Sounds great, until we realize some people don't have Javascript, so the purpose of using anatag was as a fallback to link to a login page.Javascript adds
role="button", and if javascript is disabled, well then the role remains a link.It's very niche, and I guess I don't have much experience to talk, but that sounds like a really neat solution to an edge-case.
Guess I'm OK because I use !
Actually you should use a < a > (or whatever with rôle=link) when you link to another page and a < button > (or whatever with rôle=button) when there is an onpage interaction (or a form submission). That said you can style them as you want, if you want to lose your users 😁
Learning details of web frameworks: Either one of those pictures could be the "AFTER" picture.
good idea! let's see if I can edit it on next monday
A curlyboy with no friend would slam dunk even the greatest computer program 😂
lol
Honestly, I'm surprised they didn't take the opportunity to switch the file-path-scheme with Windows 11 — I think that could have been a golden opportunity for unification.
I don't think there's a way to make the change backwards compatible. Any old program would need to be recompiled? Then you'd end with the majority of customers staying with Windows 10--oh wait!
Clever
when you are a Python 🐍 developer switch to ReactJs with TypeScript ☠
How do u know it's a frustrating day?
What is QA?
Quality Assurance
Who/what is that?! /s
I can't get it on the first time because I was thinking the issue is missing the closing quote.
Good ol'meme here