inline form field padding

I noticed this when doing this demo (get the value of an input form element). 

Looks like inline form elements look pretty average when a button is added to the same line.

i think this should be pretty easy to fix with a few added class elements.

to make the input the same height, i added this but it seems to offset it a bit to the button, where we want it to be aligned. 

CSS

.inline_input {
    padding: 7px 14px;
    font-size: 16px;
    min-height: 40px;
}

x

HTML

<input type="text" value="my value" id="my_input" class="inline_input">
<button onclick="get_input_val();" class='btn btn-primary'>Get Input Value</button>

CSS

.inline_input {
}

Other Items in css

No Items Found.

Add Comment
Type in a Nick Name here
 
Page Views

This page has been viewed 226 times.

Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code snippits here, mostly for my reference. Also if i find a good site, i usually add it here.

❤👩‍💻🕹

Random Quote
When i was a little kid, I was really scared of the dark. But then I came to understand, dark just means the absence of photons in the visible wavelength -- 400 to 700 nanometers. Then i thought, well, its really silly to be afraid of a lack of photons. Then i wasn't afraid of the dark anymore after that.
Elon Musk