CODEWITHSUNDEEP
htmlcssgoogle-chrome
Thomas Le Naour
Thomas Le Naour

Reputation: 49

Background Image doesn't display in Chrome

I'm coding a very basic page in HTML/CSS and I want to put a background-image which is a link with an URL in a div element. My code works in Safari (Mac) and Firefox but doesn't work in Chrome.

I absolutely want to put this background-image using style attribute directly in the tag because it will be an image recovered from database.

I already try to reload cache few times but it still doesn't work in Chrome navigator.

I imagine that the solution is a parameter to activate in Chrome but I don't know what.

<div class="ad-title" style="background-image: url(https://lorempixel.com/1000/350/?46548);">
  <div class="container">
    <h1>Saepe enim omnis autem ex eum expedita voluptate.</h1>
      <p>Repudiandae vel laborum dicta. Et delectus reprehenderit et nostrum in dolores. Veniam natus sit quae nulla possimus quos.</p>
      <p class="h2">
        <strong>1 chambres</strong> pour <strong>101&euro;</strong> par nuit
      </p>
      <a href="#" class="btn btn-primary">Réserver</a>
  </div>
</div>

Thank you in advance.

Upvotes: 0

Views: 1771

Answers (3)

Adrian Laufer
Adrian Laufer

Reputation: 35

After hours of struggling with this issue I figured up an easy solution to avoid this behavior of Chrome: I just cut the line of "background-image" of the .css file and pasted it in the object in the style property. It works perfect.

Upvotes: 0

Yogesh Dhiman
Yogesh Dhiman

Reputation: 299

The Class ad-title is conflicting with Chrome AdBlock extension classes. You need to be disable the extension or you can try in incognito mode.

I just have changed the name ad-title to title and it works perfectly.

Here is the solution:

https://codepen.io/ydhiman20/pen/GadWZo

Upvotes: 2

Josean
Josean

Reputation: 317

I have tested your code and it works in Firefox, Safari and also in Chrome.

Try using an incognito window in Chrome and if it works, it's a cache problem.

Upvotes: 0

Related Questions