<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Katalog</title>
    <link rel="stylesheet" type="text/css" href="scss/Style.css" media="screen" />
</head>
<body>
    <div class="Titel">
        <h1>Katalog</h1>
    </div>

    <div class="Eingabe">
        <h2>Eingabe</h2>
        <textarea name="Titel" id="text" placeholder="Titel"></textarea>
        <textarea name="Author" id="text" placeholder="Author"></textarea>
        <textarea name="Country" id="text" placeholder="Country"></textarea>
        <textarea name="Linnk" id="text" placeholder="Link"></textarea>
        <textarea name="Language" id="text" placeholder="Language"></textarea>
        <textarea name="Pages" id="text" placeholder="Pages"></textarea>
        <textarea name="Year" id="text" placeholder="Year"></textarea>
        <textarea name="Category" id="text" placeholder="Category"></textarea>
        <textarea name="ImageLink" id="text" placeholder="ImageLink"></textarea>
        <textarea name="LendTime" id="text" placeholder="LendTime"></textarea>
        <textarea name="LendType" id="text" placeholder="LendType"></textarea>   

        <button id="go">Go</button>
    </div>
    <div class="Ausgabe">
        <h2>Ausgabe</h2>
        <table>
            <tr>
                <td class ="fix">ProductId</td>
                <td>1</td>
            </tr>
            <tr>
              <td class="fix">Titel</td>
              <td>Die Bibel 2</td>
            </tr>
            <tr>
                <td class="fix">Author</td>
                <td>Mr. IchBinEinAuthor</td>
            </tr>
            <tr>
                <td class="fix">Contry</td>
                <td>Atlantis</td>
            </tr>
            <tr>
                <td class="fix">Link</td>
                <td>lmgtfy.de</td>
            </tr>
            <tr>
                <td class="fix">Language</td>
                <td>latein</td>
            </tr>
            <tr>
                <td class="fix">Pages</td>
                <td>42</td>
            </tr>
            <tr>
                <td class="fix">Year</td>
                <td>2021</td>
            </tr>
            <tr>
                <td class="fix">Category</td>
                <td>Dies ist ein Beispiel für einen viiiiiiiiiiiiiiiiieeeeeeeeeeeeeeeellllllllllllllllllll zzzzzuuuuuuuuu llllllllllllaaaaaaaaannnnnnnnnnggeeeeeeeennnnnnn TTTTTTeeeeeeeeeeeeeeexxxxxxxxxxxxt</td>
            </tr>
            <tr>
                <td class="fix">ImageLink</td>
                <td>DiesIstEinBild.png</td>
            </tr>
            <tr>
                <td class="fix">LendTime</td>
                <td>30</td>
            </tr>
            <tr>
                <td class="fix">LendType</td>
                <td>Buch</td>
            </tr>
          </table>
    </div>
</body>
</html>