Problem z pełną szerokością w background attachment

0

Witam serdecznie.
Mam problem z background-attachment w css. W swoim projekcie wykorzystuję Bootstrapa 3.

Mam taki kod:


background-image: url('assets/images/ob5.png');
        background-repeat: no-repeat;
        height: 100%;
        width: 100%;
        background-size: cover;
        background-attachment: fixed;
        background-position: center center;

Podgląd: http://serwer1356363.home.pl/pub/back/
(obrazek po lewej).

Chciałbym uzyskać coś takiego jak na screenie: http://serwer1356363.home.pl/pub/back/screen.jpeg
Czyli obrazem w pełnej szerokości.

Background-attachment effect: fixed - ten efekt chciałbym zachować.

W jaki sposób mogę to naprawić?

1

Tak:

<!DOCTYPE html>
<html>
<head>
  <title>tytul</title>
<style>
#obrazek {
  width: 30%;  
  float:left;
  padding-right:10px;
  padding-bottom:10px;
 }
</style>
</head>
<body>

<img src="ob5.png" id="obrazek">

Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
  
</body>
</html>
0

dzięki za odpowiedź. Tak niestety nie może być - chce ten obrazek mieć jako tło boczne (na lewo od containera)

1

Coś takiego?

<!DOCTYPE html>
<html>
<head>
  <title>tytul</title>
<style>
#obrazek {
  background-image: url('ob5.png');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size:30%;

  width: 30%;
  float:left;
  margin-right:10px;
  margin-bottom:10px;
 }
</style>
</head>
<body>

<div id="obrazek">
1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890.
1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890.
1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890.
1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890.
1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890 1234567890.
</div>

Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
Abcdef ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm  ghjklm.
  
</body>
</html>

0 użytkowników online, w tym zalogowanych: 0, gości: 0