Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Jeden DIV przed innymi
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
imie_nazwisko
Witam,
Mam strone opartą na css bootstrap. W kod html wkleilem DIVa:

  1. <div style="display:block;position:fixed;bottom:0;right:0;">
  2. <a class="btn btn-default" ></span> Dokument #1234</a>
  3. </div>


Niestety podczas przewijania strony powyzszy button jest pod innymi elementami strony np. textarea, input itd
Jak ustawić div'a aby powyższy button był na wierzchu?
tzm
a mozesz pokazac wiecej kodu? bo tak to sie domyslam o co Ci chodzi
imie_nazwisko
Chciałbym aby button "Dokument #1234" był zawsze na wierzchu przy przesuwaniu strony scrollem. Aktualnie chowa się pod innymi DIVami.

Kod strony poniżej:

  1. <!DOCTYPE html>
  2. <html lang="pl">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <meta name="description" content="">
  8. <title>ABC</title>
  9. <link href="css/bootstrap.css" rel="stylesheet">
  10. </head>
  11.  
  12. <body>
  13.  
  14. <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  15.  
  16. <div style="display:block;position:fixed;top:60px;right:0;"> <a class="btn btn-default" ></span> Dokument #1234 </a></div>
  17.  
  18. <div class="container">
  19. <form class="form-horizontal" method="post" onsubmit="return validateForm(this);">
  20. <fieldset>
  21.  
  22. <legend>Dane usera</legend>
  23. <div class="form-group">
  24. <label for="inputEmail" class="col-lg-2 control-label">1)</label>
  25. <div class="col-lg-10">
  26. <input type="text" class="form-control" name="Osoba" placeholder="">
  27. </div>
  28. </div>
  29.  
  30. <div class="form-group">
  31. <label for="textArea" class="col-lg-2 control-label">2)</label>
  32. <div class="col-lg-10">
  33. <textarea class="form-control" rows="2" name="Opis" placeholder=""></textarea>
  34. </div>
  35. </div>
  36.  
  37. <div class="form-group">
  38. <label for="textArea" class="col-lg-2 control-label">3)</label>
  39. <div class="col-lg-10">
  40. <textarea " class="form-control" rows="2" name="Kraj" placeholder=""></textarea>
  41. </div>
  42. </div>
  43.  
  44. </fieldset>
  45. </form>
  46. </div>
  47.  
  48. <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  49.  
  50. </body>
  51. </html>
PrinceOfPersia
sróbuj umieścić tego buttona za tym divem, a nie przed
Kod
</fieldset>
    </form>
</div>
----- TUTAJ ------
<br><br><br><br><br><br><br><br

tym sposobem będzie on później rysowany. Możesz też nadać większy z-index.
poza tym masz niepotrzebny znak cudzysłowy w textarea, dlatego ci się rozwala składnia (co widać, bo jest innym kolorem)


Cytat
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

pomijam już style inline (bo to rozumiem, że testowo wstawiłeś), to ta linijka to jakiś programistyczny WTF. Przecież możesz ustawić marginesy w CSS albo wypozycjonować absolutnie...
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.