2 replies [Last post]
joe90
joe90's picture
Offline
newbie
UK
Last seen: 8 years 6 weeks ago
UK
Timezone: GMT+1
Joined: 2014-05-18
Posts: 3
Points: 5

Very new to this, Problem setting background image property

html code
[

I want a background image on this row

This is the next row

]

css code
[
span.text-element span.text-text-1 {
font-size: 23px;
}

span.text-element span.text-text-2 {
font-size: 25px;
}

/* Layout Elements */

body > .row.background-image {
background-image:url('img/1.jpg');
}

body > .row.row-1 {
background-color: #cc3bcc;
}
]

joe90
joe90's picture
Offline
newbie
UK
Last seen: 8 years 6 weeks ago
UK
Timezone: GMT+1
Joined: 2014-05-18
Posts: 3
Points: 5

Problem setting background image property

Problem setting background image property

  <div class="row background-image">
    <div class="coffee-span-12">
      <span class="text-element"><span class="text-text-1">I want a background image on this row</span>
      </span>
    </div>
  </div>
  <div class="row row-1">
    <div class="coffee-span-12">
      <span class="text-element"><span class="text-text-2">This is the next row</span>
      </span>
    </div>
  </div>
 
 
css code here...
 
span.text-element span.text-text-1 {
  font-size: 23px;
}
 
span.text-element span.text-text-2 {
  font-size: 25px;
}
 
/* Layout Elements */
 
body > .row.background-image {
 background-image:url('img/1.jpg');
}
 
body > .row.row-1 {
  background-color: #cc3bcc;
}

helldog2004
helldog2004's picture
Offline
Enthusiast
Netherlands
Last seen: 5 years 47 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2014-03-02
Posts: 205
Points: 239

The problem is because of

The problem is because of your class.
If you take a look at the following HTML piece of code:
<div class="row background-image">
And change this to:
<div class="row-background-image">

Now we are going to take a look into your CSS code, take a look at this code of yours:

body > .row.background-image {
 background-image:url('img/1.jpg');
}

And change this code to:

body > .row-background-image {
 background-image:url('img/1.jpg');
}

Now your background image should be working Smile
Let me know if it worked out.
Cheers, Henk

Check Maximum Webdesign for your online solutions