html - CSS background image will display locally but not on gh-pages, receive 404 error -
Recently I was trying to update my portfolio by adding a background image to the 'intro' category below. I added the image through CSS and when the image was opened properly in Chrome, the image was displayed properly. However, after making my changes and then moving forward to my gh-pages, the background image no longer displays. I've been left with instead:
Failed to load resource: the server responded with a status of 404 (not found) http://jlquaccia.github.io/jq -design / img / swirl_pattern .jpg
Can anyone help? I think I have done this before killing any problem .. I am also thinking that it should be an easy decision. My code is below:
HTML
& lt; Section class = "introduction" & gt; & Lt; H1 class = "intro-title" & gt; {Hello, I'm Jason Quakasia & Lt; Br> An ambitious Gulf Area Based Front-End Web & lt; Span class "dev-design" & gt; Developer & lt; / Span & gt; & Amp; # 38; & Lt; Duration class "Dev-Design" & gt; Designer & lt; / Span & gt; } & Lt; / H1> & Lt; Div square = "down-arrow" & gt; & Lt; A href = "about #" & gt; IMG class = "down-arrow" src = ". / IMG / arrow-203-32.png" alt = "down arrow" & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt; / Section & gt;
css
.intro {height: 35em; Background: url (../img/ swirl_pattern.jpg); }
The URL is case sensitive, you are indicating: but you should point out Instead (see IMG in uppercase)
then your CSS should be like this:
.intro {height: 35em; Background: URL (../img/ swirl_pattern.jpg); }
(Note how you're correcting the arrow)
Comments
Post a Comment