Miguel Fernandez Miguel Fernandez - 3 months ago 7
CSS Question

How to hide class on print

Hello I have a page in that page the user can drag and drop elements into a container but I don't have any restriction so user can drag element outside the container. I'm thinking about adding borders to the container but I have to print this page but I don't want to print the borders. This is what I have:

.bordes {
border: solid;
border-color: #ff0000;
}

@media print {
.bordes {
display: none !important;
}
}


But this hide all the elements inside the div with this class and I only want to hide the borders, here is the code example:

Code here

If you see the example, all its fine but when you click on the print button all the div is hidden and I only want to hide the red borders. Thanks in advance

Answer

You need to remove the border only:

@media print {
        .bordes {
            border: 0;
        }
    }
Comments