Hình ảnh Parallax không điền chiều rộng - Materialize

Question

Tôi đang gặp sự cố này khi ảnh ở bên trái, tôi đã khởi chạy nó trong js, tôi đã thử thay đổi kích thước của ảnh, sử dụng các trình duyệt khác nhau, và nó có cùng kết quả. Ai đó có thể giúp tôi giải quyết chuyện này không?

HTML

<nav class="#607d8b blue-grey"> 
    <div class="nav-wrapper container"> 
    <!-- <a href="#!" class="brand-logo">Interaq</a>--> 
    <ul class="left hide-on-med-and-down"> 
     <li><a href="#">HOME</a></li> 
     <li><a href="#">GAMELIST</a></li> 
     <li><a href="#">REVIEWS</a></li> 
      <li><a href="#">NEWS</a></li> 
     <!-- Dropdown Trigger --> 
    <!-- <li><a class="dropdown-button" href="#!" data-activates="dropdown1">Dropdown<i class="material-icons right">arrow_drop_down</i></a></li>--> 
    </ul> 

    <!--Search bar--> 
    <form class="right hide-on-med-and-down"> 
     <div class="input-field"> 
     <input id="search" type="search" required> 
     <label for="search"><i class="material-icons">search</i></label> 
     <i class="material-icons">close</i> 
     </div> 
    </form> 
    </div> 
</nav> 


<div class="parallax-container"> 
     <div class="parallax"><img src="<?php echo base_url();?>materialize/img/banner1.jpg"></div> 
</div> 

quả

Answer 1

Hãy thử điều này. Sai lầm có dấu bằng sau chiều rộng thuộc tính trong câu trả lời của Krushio Vida.

<div style="width:100%;" class="parallax-container"> 
    <div class="parallax"> 
     <img src="<?php echo base_url();>materialize/img/banner1.jpg"> 
    </div> 
</div> 

Đây là, jsfiddle

Answer 2

Cố gắng thiết lập phong cách chiều rộng đến 100% trực tiếp tại divs ví dụ

<div style="width:100%" class="parallax-container"> 
     <div style="width:100%" class="parallax"><img style="width=100%" src="<?php echo base_url();?>materialize/img/banner1.jpg"></div> 
</div> 

Answer 3

Bạn nên làm cho hình ảnh của bạn đáp ứng với một class = "nhạy-img"

<img class="responsive-img" alt="parallax" src={img} /> 

Answer 4

float: right được áp dụng cho các hình thức thay vì đầu vào trường .

<form class="right hide-on-med-and-down"> 
<div class="input-field"> 

Thay đổi này để

<form class="hide-on-med-and-down"> 
<div class="input-field right"> 

Materialize Css Parallax Codepen