# Redimensionner une cellule

**URL:** <https://www.debian-fr.org/t/redimensionner-une-cellule/87859>\
**Category:** Programmation\
**Created:** [Février 13, 2023, 10:39 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859 "2023-02-13T10:39:16Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Pat66](https://www.debian-fr.org/user_avatar/www.debian-fr.org/pat66/32/11445_2.png) [@Pat66](https://www.debian-fr.org/u/Pat66)\
**Post date:** [Février 13, 2023, 10:39 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/1 "2023-02-13T10:39:16Z")

</div>

Bonjour je viens de creer une grille avec grid

```css
display: grid;
grid-template-columns: 395px 395px;
grid-template-rows: 275px 275px;
margin: 0 auto;

```

pour ce resultat :  
 ![1](https://www.debian-fr.org/uploads/default/original/2X/c/c16395d6d62d9c31ea38ef05613bed771da5e4ed.jpeg)

le soucis est je veux etendre la cellule bleu sur environ un tiers de la cellule rose . une idee sur la facon de m’y prendre ? Merci.

---

<div class="post-metadata">

**Author:** ![Zargos](https://www.debian-fr.org/user_avatar/www.debian-fr.org/zargos/32/10889_2.png) [@Zargos](https://www.debian-fr.org/u/Zargos)\
**Post date:** [Février 13, 2023, 12:57 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/2 "2023-02-13T12:57:13Z")

</div>

Bonjour,  
il te faut deux display grid d’une seule ligne, ça devrait faire l’affaire;

---

<div class="post-metadata">

**Author:** ![Pat66](https://www.debian-fr.org/user_avatar/www.debian-fr.org/pat66/32/11445_2.png) [@Pat66](https://www.debian-fr.org/u/Pat66)\
**Post date:** [Février 13, 2023, 1:47 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/3 "2023-02-13T13:47:16Z")

</div>

Merci pour ton message tu peux expliquer ( je suis un bougre de debutant)

---

<div class="post-metadata">

**Author:** ![Zargos](https://www.debian-fr.org/user_avatar/www.debian-fr.org/zargos/32/10889_2.png) [@Zargos](https://www.debian-fr.org/u/Zargos)\
**Post date:** [Février 13, 2023, 2:08 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/4 "2023-02-13T14:08:02Z")

</div>

> [@Pat66](#):
>
> ```auto
> display: grid;
> grid-template-columns: 395px 395px;
> grid-template-rows: 275px 275px;
> margin: 0 auto;
> 
> ```

C’est du CSS? en lien avec un code HTML? ou c’est un autre langage?

ton code, defini la tailles des colonnes quelque soit la ligne, puis la taille de la ligne quelque soit les colonnes; donc cette partie du code ne peux pas marcher correctement pour ce que tu veux.

regarde ce lien pour mieux comprendre et faire ce que tu vex: [Grilles CSS (CSS Grid) - CSS : Feuilles de style en cascade | MDN](https://developer.mozilla.org/fr/docs/Web/CSS/CSS_Grid_Layout)

---

<div class="post-metadata">

**Author:** ![Verner](https://www.debian-fr.org/letter_avatar_proxy/v4/letter/v/34f0e0/32.png) [@Verner](https://www.debian-fr.org/u/Verner)\
**Post date:** [Février 13, 2023, 7:45 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/5 "2023-02-13T19:45:15Z")

</div>

@Pat66  
Pourquoi faire simple quand on peut faire compliqué…

```auto
<div style="display: block; margin-left:auto; margin-right:auto;
            height:400px ; width:500px;">
  <div style="background:#f70; float:left; height:50%; width:50%;">1</div>
  <div style="background:#0a0; float:right; height:50%; width:50%;">2</div>
  <div style="background:#59f; float:left; height:50%; width:66%" >3</div>
  <div style="background:pink; float:right; height:50%; width:34%;">4</div>
</div>

```

![ksnip_20230213-204327](https://www.debian-fr.org/uploads/default/original/2X/8/8d96338e5290cf62c24c52595491e78355eb5930.jpeg)

---

<div class="post-metadata">

**Author:** ![Zargos](https://www.debian-fr.org/user_avatar/www.debian-fr.org/zargos/32/10889_2.png) [@Zargos](https://www.debian-fr.org/u/Zargos)\
**Post date:** [Février 13, 2023, 11:42 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/6 "2023-02-13T23:42:19Z")

</div>

Les deux techniques n’ont pas la même finalité, la première permet des superposition que la deuxième ne permet pas aussi simplement. de plus, cela implique que tu aies la mise en forme dans le code HTML (mauvaise pratique 😉 )  
Il me semble qu’en plus, le grid permet des positionnement indépendant du contenu.

---

<div class="post-metadata">

**Author:** ![Verner](https://www.debian-fr.org/letter_avatar_proxy/v4/letter/v/34f0e0/32.png) [@Verner](https://www.debian-fr.org/u/Verner)\
**Post date:** [Février 18, 2023, 11:56 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/7 "2023-02-18T23:56:48Z")

</div>

@Zargos  
Pour la critique: 10/10.

L’objectif est celui-ci :  
" _je veux étendre la cellule bleue sur environ un tiers de la cellule rose_",  
et pas autre chose d’hypothétique.  
5 minutes avec des divs avec illustration du résultat.

> la mise en forme dans le code HTML (mauvaise pratique)

La différence entre la théorie et la pratique est que pour un forum, c’est plus simple de proposer un bloc qu’il suffit de copier.  
Tu replaces les styles où tu veux après, l’essentiel n’étant pas là.

Au bout de 6 jours, toujours pas de solution de ta part: mauvaise pratique, mais sûrement très bonne théorie ;).

---

<div class="post-metadata">

**Author:** ![Zargos](https://www.debian-fr.org/user_avatar/www.debian-fr.org/zargos/32/10889_2.png) [@Zargos](https://www.debian-fr.org/u/Zargos)\
**Post date:** [Février 19, 2023, 7:30 UTC](https://www.debian-fr.org/t/redimensionner-une-cellule/87859/8 "2023-02-19T19:30:00Z")

</div>

pas besoin. la première fournie dans mon lien, la deuxième dans ton post.  
Donc pas besoin de solution supplémentaire, c’est inutile.