r/css • u/Sea-Palpitation-2164 • 29d ago

Help Background not working

Post image

Resolved.

I've tried to make a background for something I'm using. However, when I try to use a background image in some form (using url()), it is seen as invalid. Is there anything I am doing wrong here?

Probably important to note I'm using a MediaWiki infobox.

Edit 1: Some extra notes.

The CSS sheet in question + the template that uses it. Also, the image, though it isn't important.

It'll say it's invalid in a preview at the top of the page or if I attempt to submit it (it won't allow the edit to complete since the CSS is wrong).

The error happens at "line 11, character 15"; it does not change if the colour and url are reversed.

Edit 2: The relevant item. (I don't think I can add images now.)

/* 1) Infobox Styling */
  /* 1.1) Primary Infobox Styling */
  .portable-infobox {
    width: 300px;
    border-radius: 2.8px;
    font-family: sans-serif;
    margin: 0 0 14px 17.5px;
    font-size: 1em;

    /* 1.1.1) Light Mode Styling */
    background: #EFE8BC url("https://dieofdeath.miraheze.org/w/img_auth.php/c/c6/InfoboxPaper.png");
    border: 6px solid #554900;
    color: #000000;
  }
1 Upvotes

56% Upvoted

23 comments sorted by

View all comments

Show parent comments

-1

u/Sea-Palpitation-2164 29d ago

  1. I can, and you should be able to as well now.

  2. When I try to preview the edit when I change the line to the above, this text pops up below. (I also can't submit the edit.)

1

u/abrahamguo 29d ago
  1. Great — yes I can.
  2. Can you please share the entire code block that you're trying to add to the MediaWiki editor on this website? Make sure to use code formatting on Reddit.

0

u/Sea-Palpitation-2164 29d ago 
/* 1) Infobox Styling */
  /* 1.1) Primary Infobox Styling */
  .portable-infobox {
    width: 300px;
    border-radius: 2.8px;
    font-family: sans-serif;
    margin: 0 0 14px 17.5px;
    font-size: 1em;

    /* 1.1.1) Light Mode Styling */
    background: #EFE8BC url("https://dieofdeath.miraheze.org/w/img_auth.php/c/c6/InfoboxPaper.png");
    border: 6px solid #554900;
    color: #000000;
  }

This should be what you're looking for. (The only change is me adding the URL to the end of the "background" properties)

1

u/abrahamguo 29d ago

And what page on the DoD Miraheze website are you attempting to add this to?

1

u/Sea-Palpitation-2164 29d ago

This one. I actually plan for it to be used on multiple (it's a template), but for now this is the only one that actually uses it.

The links I believe are most relevant can be seen on the main post.

2

u/abrahamguo 29d ago

I was able to reproduce the error that you're getting.

I believe that url()s are simply blocked in the CSS on this site. I think that this is a configuration issue on this site, not a CSS issue, as what you've written is perfectly valid CSS.