Want to apply CSS only for Mobile view

  • i have designed a page, but the problem is when I see it on mobile view, i can found some blank huge space. The problem is if I remove this row which creates blank space desktop structure brock.
    So I found this blank element dev on chrome inspect:
    .flickity-enabled.is-draggable

    if i set ,

    .flickity-enabled.is-draggable {
    		top: -100px;
    	}

    here the mobile view looks great but again desktop views it brock.
    So, i want this CSS line apply only apply for movile view. Need help. i am new.

    Thanks in advance.

    The blog I need help with is: (visible only to logged in users)

  • Hi @mmoonroy,

    You can try using Media Queries. It applies specific CSS code to different screen sizes or devices.

  • Hello there

    Please try adding the below code:

    @media screen and (max-width: 680px) {
    .flickity-enabled.is-draggable {
    		top: -100px;
    }}

    Let us know if that helps.

    Regards:

  • The topic ‘Want to apply CSS only for Mobile view’ is closed to new replies.