Can someone assist me in identifying the issue with my code? I am using Symfony 2.8, Semantic UI, and Twig, attempting to set a background image on my site. The modification is being made to my base.html.twig file.
I have attempted:
- Using different images in various formats and sizes
- Placing the picture in different locations:
- In app/Resources/views
- In src/AppBundle/Resources/public/images
- In web/semantic - where my Semantic UI files are kept
- Trying different methods of setting up:
- As a body tag attribute
- As inline style within the body tag
- As internal style within a div tag
- As external style - modifying the Semantic UI CSS
I have checked if there was a path name problem through multiple experiments, but that does not seem to be the issue. Interestingly, when setting a background color instead of an image, it works perfectly fine. Only the pictures do not show up.
Any suggestions on how to resolve this problem?
This is a snippet from my base.html.twig file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %} Address Book {% endblock %}</title>
{% block stylesheets %}
<link href="{{ asset('/semantic/semantic.css') }}" rel="stylesheet"/>
{% endblock %}
{% block javascripts %}
<script src="{{ asset('/semantic/semantic.js') }}"></script>
{% endblock %}
</head>
<body style="background-image:url(siano.jpg)">
<div class="ui center aligned container">
<div class="ui grid">
<div class="four wide column"></div>
<div class="eight wide column">
<p>
<h1> Address Book </h1><br>
</p>
{% block body %}{% endblock %}
</div>
<div class="four wide column"></div>
</div>
</div>
</body>
The current file structure is as follows:
AppBundle
Resources
views
base.html.twig
siano.jpg