Je suis vraiment nouveau à CSS. J'utilise @media pour obtenir deux en-têtes différentes pour la vue mobile de mes interfaces et la vue de bureau.de à l'aide de @media, je masque les en-têtes lors de la modification des vues, mais il affiche toujours l'espace de contenu de l'autre. Il s'agit d'une vue mobile
Vue mobile a la vue sur le bureau en haut de la page. Ceci est mon code. P>
#css
@media (min-width: 320px) and (max-width: 480px) {
.desktopViewFirstRow{
visibility: hidden;
display: none;
}
<Grid.Row className="desktopViewFirstRow">
<Grid.Column width={8}>User</Grid.Column>
<Grid.Column width={4}>
<Button className="redButton">Delete</Button>
</Grid.Column>
</Grid.Row>
3 Réponses :
Retirez la minute de la largeur. Lorsque vous utilisez cela et écrivez et que vous appliquez cette règle pour les deux cas. Essayez avec celui-ci. Pas besoin d'avoir un minimum si vous voulez que cela postule pour téléphones mobiles, cela devrait fonctionner correctement.
De plus, vous devez supprimer "Visibilité: caché". Comme cela ne cache que l'élément et ne retire pas son espace, contrairement à l'affichage: aucun.
Vous utilisez à la fois Visibilité cachera l'élément mais laisse l'espace de l'élément en UI .
d'autre part,
affichage enlèvera l'élément de l'interface utilisateur et de son espace. Remarque: - Visibilité et Maintenant, selon votre requête, sur la base de vos besoins, utilisez l'une des propriétés. .
Comme vous souhaitez supprimer la position avec l'espace, supprimer la propriété de visibilité et utiliser uniquement une propriété d'affichage. espère que cela aide cela aide.
.desktopViewFirstRow{
visibility: hidden;
display: none !important;
}
This works for me.
Avez-vous essayé de l'espace blanc: Nowrap; ?