CODEWITHSUNDEEP
htmlcsstwitter-bootstrapjsptwitter-bootstrap-3
Julio Cesar Boaroli
Julio Cesar Boaroli

Reputation: 181

Spaces between bootstrap inputs not working?

I'm trying to make bootstrap inputs, like this: http://www.bootply.com/CGvw04ljGK
Ok! This Bootply example is what I want to make. But when I try this in my page this not works. Note that the spaces disappear like the image:enter image description here

This is my code:

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link href="http://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css">
    <link href="http://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/todo.css">
    <style type="text/css">
        #myPage{
            overflow-x:hidden;
        }
    </style>
</head>
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-8 col-md-offset-2 white-color">
                <h1>Cadastro de Produtos</h1>
                <form id="novoProdutoForm" method="post" class="form-horizontal container-fluid">
                    <div class="row">
                        <div class="col-md-4 form-group">
                            <input type="text" class="form-control">
                        </div>
                        <div class="col-md-4 form-group">
                            <input type="text" class="form-control">
                        </div>
                        <div class="col-md-4 form-group">
                            <input type="text" class="form-control">
                        </div>
                    </div>
                </form>   
            </div>
        </div>
    </div>
</body>
</html>

Anyone can help? I want to put the spaces between inputs.

Thanks

Upvotes: 1

Views: 399

Answers (2)

Evangelos S.
Evangelos S.

Reputation: 46

Remove the form-horizontal class from form tag and you are ready :)

Upvotes: 1

callmeniko
callmeniko

Reputation: 122

Try adding another div around the inputs like this:

<div class="col-sm-4">
    <div>
        <input class="form-control">
    </div>
</div>

Let me know if it works :)

Upvotes: 2

Related Questions