Label With Input Prefix

                    <section class="p-6 bg-white rounded-lg shadow-sm">
  <div class="max-w-md mx-auto space-y-5">
    <!-- URL with https:// prefix -->
    <div>
      <label for="website" class="block text-sm font-medium text-gray-700 mb-1">
        Website
      </label>
      <div class="flex rounded-md shadow-sm">
        <span class="inline-flex items-center px-3 rounded-l-md border border-r-0 border-gray-300 bg-gray-50 text-gray-500 text-sm">
          https://
        </span>
        <input
          type="text"
          id="website"
          placeholder="example.com"
          class="flex-1 min-w-0 block w-full px-3 py-2 rounded-none rounded-r-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
        />
      </div>
    </div>

    <!-- Email input with @ prefix -->
    <div>
      <label for="email-input" class="block text-sm font-medium text-gray-700 mb-1">
        Email Address
      </label>
      <div class="flex rounded-md shadow-sm">
        <span class="inline-flex items-center px-3 rounded-l-md border border-r-0 border-gray-300 bg-gray-50 text-gray-500 text-sm">
          @
        </span>
        <input
          type="text"
          id="email-input"
          placeholder="username"
          class="flex-1 min-w-0 block w-full px-3 py-2 rounded-none rounded-r-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
        />
      </div>
    </div>

    <!-- Price with $ prefix -->
    <div>
      <label for="price-input" class="block text-sm font-medium text-gray-700 mb-1">
        Price
      </label>
      <div class="flex rounded-md shadow-sm">
        <span class="inline-flex items-center px-3 rounded-l-md border border-r-0 border-gray-300 bg-gray-50 text-gray-500 text-sm">
          $
        </span>
        <input
          type="number"
          id="price-input"
          placeholder="0.00"
          class="flex-1 min-w-0 block w-full px-3 py-2 rounded-none rounded-r-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
        />
      </div>
      <p class="mt-1 text-xs text-gray-500">
        Enter the amount in USD
      </p>
    </div>
  </div>
</section>