Homepage carousel pictures are not responsive/extend footer menu width

Hello,

I am a beginner in website creating and now i need some help :slight_smile:
I did not find answers in the forum.

  1. Could you check why homepage carousel pictures are not responsive on the site?
  2. Is there a way to extend the size of footer menu? I want all in one line (print screen attached).

http://s2web.designerek.eu/final/wordpress/kezdolap/

Thanks in advance.

Hello there,

I hope you are doing well today.

Please try using the following plugin to regenerate the images used in the carousel:

You can use the following CSS code to reduce the space between the items by going to Appearance > Customize > Additional CSS and pasting it there.


/*Reduce footer menu  item space*/
.nav>li>a {
    padding: 5px 5px;
}

Best Regards,
Support

Thank you for your advises, i have tried them.

  1. Unfortunately I stil have the same problem with carousel (attached print screen).
  2. If i past the code header menu is also changing. I would like the changes apply only to the footer menu.

Do you have any other recommendation?

Hello there,

I hope you are doing well today.

Please remove the previous CSS code and add the following:


/*Footer adding reduction*/
.footer-nav.nav > li > a {
    padding-left: 5px;
    padding-right: 5px;
}


/*Slideshow image container in mobile*/
div#cptbc-item-622 {
    background-size: cover;
}

div#cptbc-item-626 {
    background-size: cover;
}

div#cptbc-item-627 {
    background-size: cover;
}

Please notify me of the results.

Best Regards,
Support

Hello,

thank you for your help!
Footer thing worked well.
For carousel I tried, but did not work. Then I changed the CPT Bootstrap Carousel Settings to not using background images, then it is ok now! :slight_smile:

Thanks again for your quick responses!

Hello again,
I was a bit early with being happy :slight_smile:
Now with this carousel set up tablet and phone work perfect, images are responsive. But on laptop the img is not in center.
Please see right carousel control is visible…
Any idea how to solve this?

Hello there,

Thanks for keeping in touch.

Please remove the previous CSS code for the slider and add the following which has been changed to only work on smaller screens:


/*Slideshow image container resize CSS for small screens*/
@media screen and (min-width: 480px) {
div#cptbc-item-622 {
    background-size: cover;
}
}

@media screen and (min-width: 480px) {
div#cptbc-item-626 {
    background-size: cover;
}
}

@media screen and (min-width: 480px) {
div#cptbc-item-627 {
    background-size: cover;
}
}

Please notify me of the results.

Best Regards,
Support