Is it possible to hide part of an adaptive web design on smaller screens?

This is the News page of my firs adaptive website.

enter image description here

The full height is shown (the scroll-down part is also included).

The terracotta sections on the horizontal line are for placing news feed images,
and I want to hide that section on the mobile-adapted version.

Is it possible or it may cost additional work for the developers?

Answer

This should be possible somewhat easily if you instruct your web developer accurately. They’ll have to give the bar a certain so-called class and include a media query to hide it on smaller screens.

for example:

html

<div class="foo">
    <div class="bar-element">
    ...
    </div>
    <div class="bar-element">
    ...
    </div>
    ...
</div>

css:

@media only all and (max-width: 660px) {
    .foo {
    display: none;
    }
}

Attribution
Source : Link , Question Author : Sonique , Answer Author : Vincent

Leave a Comment