#Electron Flex / weird feature

2 messages · Page 1 of 1 (latest)

queen folio
#

I got this Site and i dont know how i can make the flex go across the whole screen so i can do jusitfy-end and it actually goes to the end and not at the edge of this weird dashed out area.

#
<html>
  <head>
    <title>Tamagotchi</title>
    <link rel="stylesheet" href="index.css" />
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body class="flex h-screen w-screen p-8 m-0">
    <div class="flex flex-row items-end w-fit h-full gap-5 left-4 bottom-4">
      <div
        id="shop"
        class="w-16 h-16 rounded-full bg-[#FFE982] border-2 border-black justify-center items-center flex cursor-pointer"
      >
        <img id="shop" src="img/shopping-cart.png" />
      </div>
      <div
        id="games"
        class="w-16 h-16 rounded-full bg-[#FFE982] border-2 border-black justify-center items-center flex cursor-pointer"
      >
        <img id="games" src="img/joystick.png" />
      </div>
      <div
        id="edit"
        class="w-16 h-16 rounded-full bg-[#FFE982] border-2 border-black justify-center items-center flex cursor-pointer"
      >
        <img src="img/pencil.png" />
      </div>
    </div>

    <div class="flex self-center justify-self-end w-fit h-fit">
      <div id="pet" class="flex flex-col items-center justify-center">
        <img
          src="img/pikachu-normal.png"
          class="object-fill w-48 h-64"
          alt="Error: Please reloade this Page!"
        />
        <p class="text-3xl font-semibold">[Name of Pet]</p>
      </div>
    </div>
  </body>
</html>