How to make different Django form input buttons display on same line

Question

I am using two separate Django forms on a page I am working on and I am wanting the input buttons to show up on the same line. Currently, they are stacking. I tried using CSS styling to use the inline-block but I don't think that's working because they are in separate forms.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Title</title>
    <link rel="stylesheet"
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
    integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
    crossorigin="anonymous">
    <link rel="stylesheet" href="song_edit.css" />
</head>
<body>
<form method="POST" id="form1"> {% csrf_token %}
    <li>{{ file_name }}</li>
    <li>{{ form.as_p }}</li>
    <input type="submit" class="btn btn-primary" value="Download" name="save" id="download" />
</form>
<form action="/path/" method="get" id="form2">
    <input type="submit" class="btn btn-secondary" name="next" value="Next" id="Next" />
</form>
</body>
</html>

Fiddle

Answer 1

Is this fiddle what are you want with buttons?Just your form need display inline

  form{
  display:inline;
}

How to make different Django form input buttons display on same line

Question

1 answers

solution1
1 ACCPTED 2020-03-22 20:04:20

How to make different Django form input buttons display on same line

Question

1 answers

solution1 1 ACCPTED 2020-03-22 20:04:20

solution1
1 ACCPTED 2020-03-22 20:04:20