Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [HTML][CSS]Ustawienie obrazka w prawym dolnym rogu, background
Maksior
post
Post #1





Grupa: Zarejestrowani
Postów: 36
Pomógł: 0
Dołączył: 30.04.2009
Skąd: Reda

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


Witam, mam pytanie

Otóż chciałbym ustawić obrazek w prawym dolnym rogu diva za pomocą atrybutu "background". Proszę o podpowiedź, próbowałem ze "scroll", "background-position" niestety obrazek był oddalony od krawędzi prawej jak i dolnej. To przesunięcie jest zapewne spowodowane divem o id "maincontainer" w którym chce wstawić to tło (zawiera "margin"). Jak zrobić aby tło było dokładnie w rogu?

Pozdrawiam
Maxior

Ten post edytował Maksior 6.12.2009, 17:13:54
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
Maksior
post
Post #2





Grupa: Zarejestrowani
Postów: 36
Pomógł: 0
Dołączył: 30.04.2009
Skąd: Reda

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


http://img205.imageshack.us/img205/4017/screenbr.jpg - screen

index.html
Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Untitled Document</title>
  <link href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/style.css"]style.css[/url]" rel="stylesheet" type="text/css" /><!--[if IE 5]>
  <style type="text/css">
  </head>
  
  <body>
  
  <div id="container">
    <div id="header"></div>
    <div id="nav">
          <ul>
                  <li><a href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/index.html#"]#[/url]">1</a></li>
                  <li><a href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/index.html#"]#[/url]">2</a></li>
                  <li><a href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/index.html#"]#[/url]">3</a></li>
                  <li><a href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/index.html#"]#[/url]">4</a></li>
                  <li><a href="[url="view-source:file:///C:/Documents%20and%20Settings/ja/Pulpit/btns/final/index.html#"]#[/url]">5</a></li>
      </ul>
      </div>
    <div id="mainContent">
      <h1>Main Content</h1>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
      <h2>H2 level heading </h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
      <!-- end #mainContent --></div>
      <!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
    <div id="footer">
      <p>sd<strong>sd</strong></p>
  
    <!-- end #footer --></div>
  <!-- end #container --></div>
  </body>
  </html>


style.css (tylko wycinek)
Kod
#mainContent {
      background: url(temp.jpg) no-repeat bottom right;
      margin: 20px 20px 0 260px;
      padding: 0 20px;
  }


Ten post edytował Maksior 6.12.2009, 17:31:16
Go to the top of the page
+Quote Post

Posty w temacie


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

 



RSS Aktualny czas: 11.10.2025 - 02:31