JSFiddle - React, Tailwind, and code Playground

by SavantKing

HTML

{% extends 'base.html' %} {% load static %} {% block content %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Create a Profile</title>
    <link rel="stylesheet" href="{% static 'main/css/custom-style.css' %}" />
    <link
      rel="stylesheet"
      type="text/css"
      href="{% static 'main/css/bootstrap.css' %}"
    />
  </head>
  <body>
    <div class="container">
      <div class="inline-div">
    
        <form
          action="/controlepunt140"
          method="POST"
          type="file"
          class="form-control form-control-lg"
          enctype="multipart/form-data"
        >
          <!--  <input type="file" id="img" name="img" accept=".pdf, .xlsx"> -->
          {% csrf_token %} {{ form }}
          <input
            type="submit"
            type="file"
            value="Verstuur"
            accept="application/pdf"
          />
        </form>

        <textarea class="inline-txtarea" name="" id="" cols="70" rows="10">{{content_pdf}}</textarea>
      </div>

      <div class="inline-div">


         <form
          action="/controlepunt140"
          method="POST"
          type="file"
          class="form-control form-control-lg"
          enctype="multipart/form-data"
        >
          <!--  <input type="file" id="img" name="img" accept=".pdf, .xlsx"> -->
          {% csrf_token %} {{ form }}
          <input
            type="submit"
            type="file"
            value="Verstuur"
            accept="application/pdf"
          />
          
        </form>

        <textarea class="inline-txtarea" name="" id="" cols="70" rows="10">{{content_pdf}}</textarea>
      </div>
    </div>
  </body>
</html>
{% endblock content %}

CSS

.inline-div {
  display: inline-block;
}
.inline-txtarea {
  resize: none;
  border: 2px solid orange;
  height: 125px;
}