Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS] obrazek w prawym dolnym rogu
sowi
post
Post #1





Grupa: Zarejestrowani
Postów: 63
Pomógł: 0
Dołączył: 7.03.2004

Ostrzeżenie: (0%)
-----

Witam,
mam taki problem. Potrzebuję umieścić obrazek w prawym dolnym rogu (zawsze niezależnie od rozdzielczości) przegladarki. Problem w tym, że obrazek ma być nałozony na pasek (grafika jpg) który znajduje się na całości strony - rowniez na dole. Aby uzyskać pasek na całości na dole użylem

body {background: url("img/down_stripe.jpg") repeat-x bottom left; margin: 0px;}

Nie wiem jednak jak zrobić teraz aby dodatkowo obrazek umieścic w rogu. Czy zrobić to za pomocą nowego diva, czy można jakoś inaczej?

Ten post edytował sowi 4.08.2008, 12:09:32
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
wjkbdg
post
Post #2





Grupa: Zarejestrowani
Postów: 35
Pomógł: 0
Dołączył: 3.06.2007
Skąd: bdg

Ostrzeżenie: (0%)
-----

Z tym umieszczeniem w body deklaracji grafiki to nie jest najlepszy pomysł.
Spróbuj rozwiązania poniżej. Oba elementy są wypozycjonowane absolutnie, czyli względem odległości od krawędzi okna przeglądarki, więc rozdzielczość nie będzie miała znaczenia. Żeby obrazek nachodził na pasek, a nie był ukryty pod nim, a dokumencie HTML musisz umieścić IMG pod DIV zawierającym pasek.


[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <style type="text/css">
  5. .image {
  6.   position:absolute;
  7.   bottom:0px;
  8.   right:0px;
  9. }
  10.  
  11. #bottomStripe {
  12.   background:url('bg.jpg') repeat-x;
  13.   position:absolute;
  14.   bottom:0px;
  15.   width:100%;
  16.   height:auto;
  17. }
  18. </style>
  19. </head>
  20. <body>
  21.  
  22.   <div id="bottomStripe">
  23.      &nbsp;
  24.   </div>
  25.  
  26.   <img class="image" src="larger.jpg" />
  27.  
  28. </body>
  29. </html>
[HTML] pobierz, plaintext


Ten post edytował wjkbdg 4.08.2008, 14:06:33
Go to the top of the page
+Quote Post

Posty w temacie
- sowi   [CSS] obrazek w prawym dolnym rogu   4.08.2008, 12:08:59
- - Ar2r   Jaki masz układ strony? Znajduje się tam stopka? M...   4.08.2008, 12:23:50
- - sowi   no wlasnie z tym jest problem. Bo klient zazyczyl ...   4.08.2008, 13:20:43
- - Ar2r   A ta grafika w rogu ma nakładać się na koniec obsz...   4.08.2008, 13:35:10
- - sowi   ma byc na obrazku linii ustalonym w body, i ma byc...   4.08.2008, 13:37:48
- - Ar2r   Nie wiem czy o to Ci chodzi, ale dodaj pod obszare...   4.08.2008, 13:46:59
- - wjkbdg   Z tym umieszczeniem w body deklaracji grafiki to n...   4.08.2008, 14:03:11
- - Gość   KodCSS #box_glowny { position : absolute...   28.08.2008, 13:56:31
- - -axel-   KodCSS #box_glowny { position : absolute...   28.08.2008, 13:57:28
- - -axel-   KodCSS #box_glowny { position : absolute...   28.08.2008, 13:59:29

« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 9.10.2025 - 23:04
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn