Blockquote Background (And a few other) Design Issue

Technical Details

Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Screenshot of problem : https://i.imgur.com/XuweNet.png
Who the problem concerns : All members
When the problem appeared : As soon as I added the image to the background of the blockquote.
Forum link : http://superhero-rpg.com

Description of problem

Hi there Forum Motion!

Chellizard here again with another little bitty problem!


So my forum has been undergoing appearance changes, always, and I finally got around to fixing the backgrounds for Spoilers, Code boxes, and the Quote box...

HOWEVER!

The background for the Quote is off-centered.



I have attached the image.

Here is the code I am using:

Code:

blockquote {
  padding: 6px;
  background-image: url('http://fc00.deviantart.net/fs70/f/2014/119/2/e/shrp_chatbox_background_2_by_chellizard-d7gh7u1.png');
  background-color: #000000;
  border: 1px solid #C9D2D8;
   font-size: 1em;
-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
  border: 2px solid #101010;
   }

Thanks for you time and patience guys!

I'm looking forward to a reply! C:

Hey @Chellizard,

It looks like you just need to set the background-position property to 0 so that the image starts at the very top left.

Code:

blockquote {
  padding: 6px;
  background-image: url('http://fc00.deviantart.net/fs70/f/2014/119/2/e/shrp_chatbox_background_2_by_chellizard-d7gh7u1.png');
  background-color: #000000;
  background-position:0 0;
  border: 1px solid #C9D2D8;
  font-size: 1em;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
  border-radius: 10px;
  border: 2px solid #101010;
}

Once that's done it should be perfect/

Awwwe hooww did I miss that? I suppose I was just too tired last night! Thank you so much, as always, Ange!


I have one more question so I may retitle my topic to accommodate for that.


I was wondering how I change the color of this area of the text editor:



The gray area that the arrows are pointing to. c:

If there is already a topic, I guess I couldn't find it, or I was using the wrong key words.

AP > Display > Colors & Pictures > Colors
Colors Tab
Background Colors Section
Editor background color (Toolbar):

I want to make it an image like the text area.

Since this is not related to the first post, please start a new topic.

Hi

Please post this in your CSS:

Code:

div.sceditor-toolbar {
  background-color: #;
}

Change the background-color to a value of your choice.

Regards,
Pizza Boi

The above code should work just fine, although you may need to add !important after the value.

If you want a background image, just use the usual background properties, for example :

Code:

background:#000 url('IMAGE') repeat 0% 0%;