1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Unable to find these properties in style manager...

Discussion in 'Styling and Customization Questions' started by JVCode, May 29, 2013.

  1. JVCode

    JVCode Well-Known Member

    I'm banging my head right now because I'm unable to find the following in style properties...

    • (See the yellow marked areas)

    • The yellow behind the text input area...

    • The yellow behind the text input area...
    Capture 3.PNG

    • How do I remove the arrow in the image below ?
    Capture 4.PNG

    Thanks very much :)
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Not everything is in Style Properties.

    The easiest thing to do is use one of the browser inspection tools and utilise EXTRA.css.
  3. erich37

    erich37 Well-Known Member

    you can change the background for the fields (this will change ALL fields) from white to some other color with this:

    background-color: #FFCC33;

    However, when the field is active (when you click into the field), the yellow gradient is an image......

    you would need to change the image itself in order to change the color from "yellow" to something else, since the color is build into the image. it is not using CSS for the color.

  4. erich37

    erich37 Well-Known Member

    in order to change the color of the line (your very first screenshot), put this code into your template "extra.css"

    .nodeList .categoryForumNodeInfo, .nodeList .forumNodeInfo, .nodeList .pageNodeInfo, .nodeList .linkNodeInfo {
        border-bottom: 1px solid #DDDDDD !important;
    JVCode likes this.
  5. JVCode

    JVCode Well-Known Member

    Thanks very much, the above edit worked lovely for the forum home, what about profile, who's online and thread list? :)

    Capture 6.PNG

    Capture 5.PNG

    Capture 7.PNG
  6. erich37

    erich37 Well-Known Member

    this is for the Profile:
    .messageSimple {
        border-bottom: 1px solid #FFCC33 !important;

    this is for the thread-list:
    .discussionListItem {
        border-bottom: 1px solid #FFCC33 !important;
  7. erich37

    erich37 Well-Known Member

    but you could just use this code, then the color of the line should change everywhere in one shot :D

    .primaryContent {
        border-bottom: 1px solid #FFCC33 !important;
  8. napy8gen

    napy8gen Active Member

    Actually the border concerned is in style properties, go to appearance--->style properties -->building blocks---> primary content--> Look at border bottom.

    The yellow gradient inside text field look under Forms--> text control, focused state --> clear the gradient bg image.
    And maybe you should do also text area, focused state.

    And for user info arrow, paste inside extra.css
    .messageUserBlock .arrow {display:none!important;}
    Steve F and JVCode like this.

Share This Page