How to fix this(watch image)? [closed]


How to fix this(watch image)? [closed]



I am working on some thing but the search bar and the button won't align.I tried setting the display to inline and inline-block.Please help me, i am stuck.
Browser: Android chrome.
(https://i.stack.imgur.com/hMBdm.jpg)



HTML:









</div>



CSS:


input{
position: relative;
display: inline-block;
box-sizing: border-box;
transition: .5s;
}
input[type="text"]{
height: 50px;
background: #474b4f;
width: 80%;
border: none;
outline: none;
padding: 0 25px;
}
input[type="submit"]{
height: 50px;
left: -5px;
position: relative;
width: 15%;
border: none;
outline: none;
background: #6b6e70;
color: #222629;
}
.overlay {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
left: 0;
top: 0;
background-color: rgba(97, 137,
47, 0.87);
overflow-x: hidden;
transition: 0.5s;
}



This question appears to be off-topic. The users who voted to close gave this specific reason:





Provide some code please, so we can figure out what's going on.
– Jacob-Jan Mosselman
Jul 2 at 10:33




1 Answer
1



if you are using xml for design use


android:layout_alignBottom="id of adjacent view"



and make sure that the size of both views is equal.

Popular posts from this blog

PHP contact form sending but not receiving emails

Do graphics cards have individual ID by which single devices can be distinguished?

iOS Top Alignment constraint based on screen (superview) height