All Questions
501
questions
0
votes
1
answer
27
views
using :focus without a button or link?
Is it possible to use :focus without having a button or link to focus something? I'm trying to put the code into a game which "doesn't allow" buttons and when I try using <a href="#&...
0
votes
2
answers
45
views
Lost focus on one input effects all inputs
I have created an application form with a validation function that requires the user to input the correct information within the boxes before clicking away from that focused box or an error message ...
0
votes
1
answer
34
views
using :focus to show something with a button
I have a question regarding :focus. I want to have a button/text that shows <div class="contentbox2"> when clicked, but i'm really struggling with that. I tried several ways but i can ...
1
vote
0
answers
13
views
selectorprimaryfocus in ComboBox
I am trying to set focus to a comboBox which is present inside a Tearsheet when the tearsheet is opened. but it doesnt work.
import { ComboBox } from "@carbon/react";
import { Tearsheet } ...
0
votes
1
answer
45
views
React js make background blur when input is focused
I want to create an input field like in the picture, if the input field becomes focused then I want to change the background to blur
image example
Do I have to use a certain library? I'm currently ...
0
votes
2
answers
116
views
Can't find CSS selector to style Shadow DOM delegated focus
EDIT 1+
Ok, sorry for the wild goose chase. this appears to be a straight forward CSS issue. In the light DOM: -
#disTick::part(endo) {
box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px ...
0
votes
1
answer
44
views
Why is focusing an html element with the keyboard different than focusing with the mouse?
I'm trying to style an element based on whenever it's focused (either by holding a mouseclick on it, or while selecting it using the tab key), but I'm having different behaviors depending on which ...
1
vote
0
answers
587
views
Unable to Change Border Color of Mantine PasswordInput Field in Focus
I'm currently working on a project using the Mantine library, and I've encountered an issue while customizing the CSS of a PasswordInput component. Specifically, I'm trying to change the border color ...
0
votes
0
answers
28
views
Trigger/Modify Browser ScrollIntoView Behavior on Focus
I have a scrollable table with a sticky header & footer, and input fields in each cell - think an Exel-like table. Now I encountered a problem when using tab to focus input fields in a row further ...
1
vote
0
answers
34
views
Firefox focus styling not using correct tab order
In Firefox - when clicking to the left of my navbar and then pressing tab I end up focusing the 3rd element in my navbar not the first element like I would expect.
I have made a code pen to simplify ...
1
vote
2
answers
56
views
button on click event does not fire if active textarea has css to change size on focus
As you can test in snippet if i focus textarea and click on button no action fires, i have to click one more time
removing focus style all works fine.
what can i do?
thanks
textarea:focus{
...
0
votes
0
answers
42
views
Why TextArea focus does not allow user to select and copy text?
In my angular application, I have a TextArea field and I am disabling and enabling it conditionally. Also I apply focus on it whenever it is enabled. But, Whenever the textArea field gets enabled and ...
1
vote
0
answers
119
views
DataTables - focus in search field missing after loading page for first time
Using DataTable and Bootstrap I would like to have the search field in focus after page load. Unfortunately, I'm not able to achieve it. When the page is loaded and I refresh it, then the search field ...
7
votes
1
answer
3k
views
Input fields adding focus-visible on click
I am attempting to selectively apply an outline on an input field only when the user has navigated to the element by keyboard. From my understanding the way to do this is removing the outline on focus ...
0
votes
1
answer
70
views
Pseudo :focus-within not working in Safari
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<...