I am trying to load a local HTML file using the WebView component. Everything works fine except the CSS transitions. Here is my HTML file
<!DOCTYPE html>
<html>
<head>
<title>HTML GUI</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
input[type=text]{
padding: 5px;
text-align: center;
-webkit-transition: width 2s;
transition: width 2s;
}
input[type=text]:focus{
width: 80%;
}
</style>
</head>
<body>
<div id="welcomeText">Welcome</div>
<div id="user-block">
<label>User Name:</label>
<input type="text"/>
</div>
<div id="pw-block">
<label>Password:</label>
<input type="text"/>
</div>
</body>
</html>
The issue is that whenever I click on the input, the transition happens instantly. The transition time is completely ignored. Am I doing something wrong? Are transitions even supported by the WebView? NOTE: I am using JDK 8 (1.8).
UPDATE: FIXED I have managed to fix it by specifying a width for the input...