How to make custom login button work

Tags: javascript,jquery,html,css,jsp

Problem :

I am trying to have a custom login button function has a button, but when I try, I have another button overlapping the desired login button. Here is what it looks like.

enter image description here

Here is the HTML.

<div class="login_btn">
    <input type="submit" name="submit">

The button that says submit actually works, so the functionality is not the problem. I just was the button that says Login to work and make the Submit button disappear.

How do I make that happen? I do not know HTML so if more code is needed, please ask and I will supply it.

EDIT: The code

<input class="login_btn" type="submit" name="submit" value="Login">

creates this

enter image description here

Here is my CSS

.container .login_component .login_wrap .login_wp .login_btn {
    height: 55px;
    margin-top: 30px;
    background-repeat: no-repeat;
    background-position: center center;

Solution :

Apply your class to the input button.

<input class="login_btn" type="submit" name="submit" value="Login">

    CSS Howto..

    CSS- How to align background image over bottom border line? Jsfiddle included

    How do I give a WordPress Custom Menu item an id or class for CSS targeting?

    How to write specific CSS for mozilla, chrome and IE

    How to isolate PrimeFaces Widget from being affected by main site CSS

    How to Style Specific Element On Hover With CSS?

    How can I put CSS and HTML code in the same file?

    How to top align two cell divs within a table div when one cell div contains an absolute positioned div?

    How can I add the following css code to my page header from functions.php?

    How to make transparent arrow? [duplicate]

    How to select span element inside multiple div classes and id's?

    how to make a div expand to wrap a dynamic content in css

    How to use HTMLElement.classList(.toggle)?

    How quora put that image on their home page? [closed]

    how to put image and texts on img html css

    How to create a folding ribbon heading with inside gradient?

    CSS: How to create special shape

    why is my css speech bubble displaced so frequently? How can I prevent this?

    How to force a browser to show the latest changes to a CSS file?

    How can I make DIVs within a display: table-cell fill the cell?

    How to get equal height for all sections?

    How to remove scrollbar in PrimeFaces dialog?

    How to get the CSS width of a mobile device in ASP.NET MVC?

    How to replace with a
    filled with CSS?

    how can we use and control Gradient

    How to target and style specific elements using CSS

    How can I determine the escape sequence for characters in an icon font?

    how to specify a different image in css depending if the user visits on a desktop or a mobile browser

    How to revert to original CSS?

    Content attribute in CSS to show image icon

    CSS Overflow: overlay. Is it deprecated? How can I replace it?