Blockquote Background (And a few other) Design Issue Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
4 posters

    Blockquote Background (And a few other) Design Issue

    Chellizard
    Chellizard
    Forumember


    Female Posts : 154
    Reputation : 12
    Language : English

    In progress Blockquote Background (And a few other) Design Issue

    Post by Chellizard July 29th 2015, 3:58 am

    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.

    Blockquote Background (And a few other) Design Issue XuweNet

    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:


    Last edited by Chellizard on July 30th 2015, 7:35 pm; edited 1 time in total
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by Ange Tuteur July 29th 2015, 11:01 am

    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/ thumleft
    Chellizard
    Chellizard
    Forumember


    Female Posts : 154
    Reputation : 12
    Language : English

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by Chellizard July 30th 2015, 2:33 am

    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:

    Blockquote Background (And a few other) Design Issue PRimbE2

    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. Sad
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51493
    Reputation : 3523
    Language : English
    Location : United States

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by SLGray July 30th 2015, 7:06 am

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



    Blockquote Background (And a few other) Design Issue Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Chellizard
    Chellizard
    Forumember


    Female Posts : 154
    Reputation : 12
    Language : English

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by Chellizard July 30th 2015, 7:34 pm

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


    Male Posts : 51493
    Reputation : 3523
    Language : English
    Location : United States

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by SLGray July 30th 2015, 7:58 pm

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



    Blockquote Background (And a few other) Design Issue Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Pizza Boi
    Pizza Boi
    Hyperactive


    Male Posts : 2016
    Reputation : 160
    Language : French
    Location : Pizza Hut!

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by Pizza Boi August 1st 2015, 9:52 am

    Hi Very Happy

    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
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: Blockquote Background (And a few other) Design Issue

    Post by Ange Tuteur August 1st 2015, 11:25 am

    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%;