Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Need to change from a background image to background colour in css

Featured Replies

Hi Guys,

 

Am a total novice coder just doing a bit on my ebay store i have removed the background image and just want the background to be white.

 

Any ideas how to do this as the background is currently black.

 

there seems to be so many css files in my file structure am not even sure which one i should be looking at. I really need an experts advice, I have been stung to many times with simple things like this on freelancer and just need to get it done.

 

This is the page am trying to change

 

http://stores.ebay.co.uk/Say-it-with-Print?_trksid=p2047675.l2563

 

it also needs changing on the listings as you can see

 

http://www.ebay.co.uk/itm/Personalised-Photo-Boy-Girl-CHRISTENING-Baptism-Naming-Day-Invitations-C03-/131059547285?rd=1

 

any advice would be great thanks

I wouldn't normally recommend this but seen as you really have little idea what you are doing and just want the issue fixed this will work,

put it in any of your stylesheets as the background image on the body is applied via JavaScript which increases it's specificity so it will need the [style] added to the selector along with !important.

 

This will override it.

body[style] {
  background: white !important;
}

Edited by rbrtsmith

Good god those ebay pages aren't a pretty site under the hood.

 

You need to change this

body{text-align:center;background-position:center;background-repeat:repeat-y;background-color:transparent;margin:0!important;overflow-x:hidden}

to this

body{text-align:center;background-position:center;background-repeat:repeat-y;background-color:white;margin:0!important;overflow-x:hidden}

Which is contained in this CSS file

 

http://www.sayitwithprint.net/shop-front/css/sayitwithprintNEW.css

Good god those ebay pages aren't a pretty site under the hood.

 

You need to change this

body{text-align:center;background-position:center;background-repeat:repeat-y;background-color:transparent;margin:0!important;overflow-x:hidden}

to this

body{text-align:center;background-position:center;background-repeat:repeat-y;background-color:white;margin:0!important;overflow-x:hidden}

Which is contained in this CSS file

 

http://www.sayitwithprint.net/shop-front/css/sayitwithprintNEW.css

 

That change will not override the inline style that has been applied by a script. You can see it applied via chrome dev tools.

The inline style on the body element only consists of the following

<body id="body" class="gh-1199 gh-979 gh-flex" style="background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAKCAYAAAB10jRKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBJREFUeNpEyqERADAIBMGbbwSH+qhA/6URXMyqBUhFBLIP6ip0ezk2zExqC58nwACVZwX67tO41gAAAABJRU5ErkJggg=="), none; background-repeat: repeat-x, repeat-y; background-position: 0px 30px, 50% 50%;">

So it only affects the background-image, background-repeat and background-position properties.

 

Editing the CSS file in FF developer tools to white seems to work fine

post-33158-0-89775300-1472512344_thumb.png

post-33158-0-77797100-1472512359_thumb.jpg

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.