Fix my @media query measurements

  • Status: Closed
  • Prize: $50
  • Entries Received: 8
  • Winner: krishmob

Contest Brief

I'm having trouble with my media queries. When I edit one screen resolution, it messes up another slightly, and I can't figure out the logic. This is where I need your help Freelancer community!

My .css is attached. The contest winner will be the first person whose modifications to my media queries fix my design (I will not be sharing my design).

Explanation of my classes:

~.full-image-container holds
~ .hs_cos_gallery_main, .hs_cos_gallery_thumbnails, .hs_cos_gallery_lightbox
~ .cta-box-1 sits under the hs_cos_gallery...
~ .homepage-content sits under .cta-box-1
~ .cta-box-2 sits under .homepage-content
~ .site-page-footer sits under .cta-box-2

MOST IMPORTANTLY: Inside the hs_cos_gallery is an image with the size of 3165 x 1375. This is my main banner that I need to adapt (shrink and grow) according to the screen resolution - hence why I'm doing the media queries.

Everything underneath that image in hs_cos_gallery needs to properly fall underneath it. There should be no gaps or overlaps with the hs_cos_gallery and cta-box-1. This has been my biggest issue.

Note: There is no need to style the headings.

Happy to answer questions where I can.

Thank you!

Recommended Skills

Winner
Featured Contest
Post a Contest Like This

Employer Feedback

“krishmob followed the brief of my contest correctly, and provided a great solution and updating it with my feedback. krishmob has gone above and beyond.”

Profile image nicolestoletheco, Australia.

Public Clarification Board

  • nicolestoletheco
    Contest Holder
    • 7 years ago

    Hi everyone - I am reviewing all the entries that have submitted their CSS in. Thank you very much for reading the brief.

    A reminder, that the winner of the contest is the person who provides the code that fixes my site first. I am literally applying and testing your CSS to see if it works. I'm sending screenshots also to each entrant.

    FYI to everyone: Make sure your responsive code works on all web browsers.

    • 7 years ago
    1. krishmob
      krishmob
      • 7 years ago

      HI, Please check my PM #1

      • 7 years ago
  • nicolestoletheco
    Contest Holder
    • 7 years ago

    Hi all - the HTML file cannot be shared because it's driven by a templating system, so the design is not coded purely by HTML. The CMS is Hubspot.

    Also - there is a reason why this is a contest, and not a project. Only one contestant has politely fit the brief of the contest.

    • 7 years ago
    1. ahmadzaimhamzah
      ahmadzaimhamzah
      • 7 years ago

      Try this. Let me know if it works. http://kreativsquad.com/upload/nicolestoletheco.css

      • 7 years ago
  • ahmadzaimhamzah
    ahmadzaimhamzah
    • 7 years ago

    Hi. Already fixed your css, please initiate chat with me so I can send to you for testing.

    • 7 years ago
  • OlgaNieminen27
    OlgaNieminen27
    • 7 years ago

    Hi.I can your needs completly.I dont money.I needs review.I will complete your needs free.Please contact me.

    • 7 years ago
  • web360degrees
    web360degrees
    • 7 years ago

    Would you be able to share your html file? #extended

    • 7 years ago
  • Prajeesh007
    Prajeesh007
    • 7 years ago

    check my works: https://www.behance.net/Praji

    • 7 years ago
  • shahgsahab1
    shahgsahab1
    • 7 years ago

    please contact me .I can do this for you.waiting for your response

    • 7 years ago
  • shahgsahab1
    shahgsahab1
    • 7 years ago

    can you please send your html code

    • 7 years ago
  • kashifunisol
    kashifunisol
    • 7 years ago

    hi i can fix that.......

    • 7 years ago

Show more comments

How to get started with contests

  • Post your contest

    Post Your Contest Quick and easy

  • Get tons of entries

    Get Tons of Entries From around the world

  • Award the best entry

    Award the best entry Download the files - Easy!

Post a Contest Now or Join us Today!