AtomicAnomaly Posted March 4, 2015 Share Posted March 4, 2015 (edited) I'm experienced, yet still a "beginner" in web-development, so I ask: How do I adjust the the radius of the outline of an "in focus" input object to match it's border-radius value? /*Input field style*/input { display: block; border: 1px solid #aaaaaa; border-radius: 2px; padding: 12px; font-size: 18px; font-family: Sansation; margin-left: auto; margin-right: auto; margin-bottom: 5px;}/*Input field focus style*/input:focus { outline: 2px solid #28c789; /* Outline Radius Value? */} I do apologize for my ignorance on the subject, but I figure there must be a way. Thank you! Edited March 4, 2015 by AtomicAnomaly Link to comment Share on other sites More sharing options...
Ingolme Posted March 5, 2015 Share Posted March 5, 2015 It doesn't look like the outline can have a radius. I looked it up and found this: http://stackoverflow.com/questions/5394116/outline-radius You could hide the outline and show a border instead. Link to comment Share on other sites More sharing options...
tejasamrute Posted March 5, 2015 Share Posted March 5, 2015 input:focus { outline:none; border:none; box-shadow: 0 0 5px 5px red;} Try this.... Link to comment Share on other sites More sharing options...
AtomicAnomaly Posted March 6, 2015 Author Share Posted March 6, 2015 Inglome: I had previously found the same thread, and found it a tad confusing, but I appreciate the help! Tezzo: I think I liked the outcome of your suggestion better than my rounded outline plan. Thank you both for your help! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now