• Resolved tora0515

    (@tora0515)


    Hello,

    I would like to add background color around my slider that fills the vertical width of the page. Not a border but a background.

    I have changed the body’s background, but since my slider’s width is less then the footer’s and header’s width, the body’s background color makes the site look like an I.

    I have tried using width: 100%; on #customizr-slider, #customizr-slider.container, .carousel-inner, and .carousel. But each of these just make the slider’s width 100%, so the picture now stretches across the screen.

    So I am after the wrapper or container that the slider is centered in, so I can make that the same width as the page, then give it a background color.

    Thanks

Viewing 6 replies - 1 through 6 (of 6 total)
  • If I understand what you are trying to achieve…just thinking here, haven’t tested it…and your site is not available…but referring to your post here, have you tried something like this:
    .carousel { width: 1240px; max-width: 1240px; margin: 0 auto; }
    This will certainly affect your images…but I don’t know if anything else will be affected…responsiveness may suffer…the background color at the right and left would be the same as the body…

    Edit: nevermind, trying to check using my own site…not quite working for what I think you are trying to achieve…

    Thread Starter tora0515

    (@tora0515)

    Ah, sorry, forgot the link

    https://melbourneactuary.net63.net/

    Thanks for the comment.

    Yeah, I’ve tried what you’ve said above, but the image then becomes the same width as the page (which you’ve said), and this is not what I would like.

    I am after is the div that sits between the header.tc-header and the main-wrapper and holds the carousel.

    Like I mentioned in the other topic…your site link is not working for me…it times out and says page is not available…

    Guess I am confused on what you are trying to achieve…afaik, the main div id for the slider is #customizr-slider …as I mentioned in the other topic, I am not an expert…so…I guess I will have to leave it to them…sorry…

    Thread Starter tora0515

    (@tora0515)

    Hey Deputy05,

    That’s lame… guess it’s to be expected from free hosting…yeah for testing…

    Anyway, your answer guided me to what I wanted. I did this:

    #customizr-slider {
    width: 90%;
    padding: 1% 5% 0 5%;
    margin: 0 auto;
    background: #ffffff;
    }

    Forgot that padding could be used and with % instead of px it does the trick.

    Thanks for checking up on all my posts. It’s much appreciated.

    You are welcome…glad I could help lead you to a possible solution…

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘what id or class is holding the container?’ is closed to new replies.