Parallax Image doesn't fill the width - Materialize - html

Question

I'm having this problem where the picture stays to the left, I've already initialized it in my js, I tried changing the size of the picture, used different browsers, and it has the same result. Can somebody help me in solving this?
HTML
<nav class="#607d8b blue-grey">
<div class="nav-wrapper container">
<!-- Interaq-->
<ul class="left hide-on-med-and-down">
<li>HOME</li>
<li>GAMELIST</li>
<li>REVIEWS</li>
<li>NEWS</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>
Result

Answer 1

Try this out. Mistake was equal sign after width property in Krushio Vida's answer.
<div style="width:100%;" class="parallax-container">
<div class="parallax">
<img src="<?php echo base_url();>materialize/img/banner1.jpg">
</div>
</div>
Here is, jsfiddle

Answer 2

Try to set width style to 100% directly at the divs e.g.
<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

You should make your image responsive with a class="responsive-img"
<img class="responsive-img" alt="parallax" src={img} />

Answer 4

float:right is applied to the form instead of input-field.
<form class="right hide-on-med-and-down">
<div class="input-field">
Change this to
<form class="hide-on-med-and-down">
<div class="input-field right">
Materialize Css Parallax Codepen