Hide And Show Desktop And Mobile

Controlling Visibility on Desktop and Mobile Using CSS


show only desktop
show only mobile

View

<style>
@media screen and (max-width: 600px) {
.hiddenPhone {
display: none;
}
}

@media screen and (min-width: 600px) {
.hiddenDesktop {
display: none;
}
}
</style>
<div class="card">
    <div class="card-body">
        <div class="col-lg-6">
            <div class="hiddenPhone">
                show only desktop
            </div>
        </div>

        <div class="col-lg-6">
        <div class="hiddenDesktop">
            show only mobile
        </div>
        </div>

    </div>






</div>