Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • Pankaj Sharma Moderator
    #1049929

    Hi
    Can u share the URL of site Here.
    You can apply the background css on the module class.
    Add a module suffix in the module option and apply background css on it.
    For example,
    Module suffix: red
    css would be
    .red {background:red;}

    Regards

    Rainer Friend
    #1050014

    Thanks Pankaj,

    please have a look at the first attached image and allow me to repeat my question: I want to display the background on the whole green marked area. (I already described in my initial post, that setting a separate CSS class for the four modules or using the Module Suffix of each of these modules is displaying only the red marked area).

    The problem is, that each of the layout positions (position-1 to position-4) at the ‘Our Service’ area Layout of JA Nuevo template has the same class: <div class=" col-lg-3 col-md-3 col-sm-3 col-xs-6">

    So I think, what we need, is to change one or more files in the JA Nuevo template to get an own class for each of the four Layout positions (position-1 to position-4).

    For this you don’t need access to my website. This can be done with your blank template JA NUEVO. Also you have my modification of HTML code in my initial posting.

    Attached you get a screen shot from JA Nuevo template Layout, marked the mentioned area.

    Thanks and a nice day Rainer

    • This reply was modified 7 years, 4 months ago by  Rainer.
    • This reply was modified 7 years, 4 months ago by  Rainer.
    • This reply was modified 7 years, 4 months ago by  Rainer.

    1. template_layout_position-1to4
    Pankaj Sharma Moderator
    #1050026

    Hi
    Add below code in custom.css file to apply background on spotlight block

    .t3-sl-1 {background:#eee;}

    If this does not work please share the URL of site where you applying changes, i will check it on your site.

    Regards

    Rainer Friend
    #1050033

    Hi Pankaj,

    please remember I want to set four different background classes. One for each Layout position. So what you recommended in your last posting can’t work.

    Allow me to repeat: for that you don’t need my URL. This is JA Nuevo template basic.

    Thanks Rainer

    Pankaj Sharma Moderator
    #1050042

    Hi
    If you want 4 different backgrounds please add the module suffix in the module options and apply different colour by adding the style classes.
    I am not sure why it’s not working at your end.
    If i have URL i can check your site for this, without site its hard to assume the issue.
    Hope you understand.

    Regards

    Rainer Friend
    #1050056
    This reply has been marked as private.
    Pankaj Sharma Moderator
    #1050058

    Hi
    I got your padding you want to display the background on module area as well as in the position.
    But in each module position, there is padding in left and right.
    See this http://prntscr.com/fxyqvn
    You can not add the colour on this are as it’s not covered the module.And each position has same class so if you will apply colour for padding area it wil be applied for all positions.

    In this case first you have to remove the padding by adding below code in custom.css file

    .t3-spotlight-1 > div {
        padding: 0px;
    }
    

    It will remove the padding and your color will be visible,
    This is i can suggest you with current details.

    Regards

    Rainer Friend
    #1050070

    Perfect, Thanks a lot, Pankaj,

    this solved the problem.

    All the best – Rainer

    Pankaj Sharma Moderator
    #1050073

    You are welcome!

Viewing 9 posts - 1 through 9 (of 9 total)

This topic contains 9 replies, has 2 voices, and was last updated by  Pankaj Sharma 7 years, 4 months ago.

The topic ‘position 1 to 4 – different background color to each position’ is closed to new replies.