Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Help a Swede please!

Posted by: M.Julin Jul 2 2020, 04:21 PM

Hello.

I am new here and also a newbee when it comes to html.
I got a problem with my webpage that I`m working with.
The images are floating together on some pc:s with lower resolution.
On cell phones and my widescreen (1920x1080px) they are working fine.

Can someone please help me to understand why this is happening?
The link is: https://www.bildeffekt.se/mullsjo8/index.html

Click on: Våra tjänster & Priser.

I am from Sweden and the webpage is on Swedish, and my English
may be funny somehow, forgive me for that ;-)

Best regards Mikael from Sweden.

Posted by: Christian J Jul 3 2020, 04:26 PM

It seems to be a responsive design (meaning the layout changes at a certain width):

https://www.bildeffekt.se/mullsjo8/css/templatemo_main.css

CODE

@media (max-width: 991px) {
    .footer {
        overflow:hidden;
        position:static;
        text-align: center;

    }
    .footer-text {
        margin-left: 0;
    }
}

In slightly wider browser windows than that (1200px?) the IMG elements may overlap just a little, maybe because they use a fixed width of 150px while their parent DIV widths use a variable percent width.

A quick fix might be to try a larger value for the @media max-width, so that it kicks in before the images' parent DIVs become too squeezed together. Probably similar changes are needed in the javascript as well, I didn't check that part.

Posted by: M.Julin Jul 11 2020, 02:13 AM

Thanks for the tip ;-)

Best regards Mikael.