Ranger le tableau avec Bootstrap

Question

J'utilise bootstrap depuis un certain temps maintenant mais je ne peux pas faire cette chose (je ne sais même pas comment le faire sans Bootstrap). Ce que je veux, c'est indenter soit un tableau ou des divs. J'ai vu quelque chose comme ça fait en Bootstrap avec

• mais rien avec des tableaux. Fondamentalement, je veux un tableau avec le qui est le titre et en dessous les noms des projets. La raison pour laquelle j'ai besoin d'indenter est que les projets dépendent d'autres projets; donc le projet en dessous d'un autre projet doit être positionné légèrement à droite de son parent (ce qui est essentiellement une indentation, non?)

Answer 1

Voici quelques options si ce dont vous avez besoin est une petite indentation pour suggérer une hiérarchie. Ils ne sont pas spécifiques aux tables Bootstrap.

La première consiste à ajouter quelques espaces insécables par niveau d'indentation souhaité. Cela a l' avantage que les espaces peuvent être ajoutés par le code produisant le contenu de la table sans perturber le html de la table. Cela a le inconvénient que si le texte se coupe dans la cellule, les lignes coupées ne seront pas indentées. De plus, tous ces espaces insécables invisibles peuvent entraîner des surprises lors de la copie/collage.

  Texte indenté
    Encore plus indenté

Si votre code émet le html de la table, une meilleure solution est de modifier le padding de la cellule de la table par des quantités croissantes. Cela a l' avantage d'un contrôle plus fin que les incréments d'espace insécable, et le texte coupé est également indenté. L' inconvénient ici est que vous émettez du html à partir du code et cela peut rendre plus difficile l'ajustement de la mise en page.

Texte indenté
Encore plus indenté

Answer 2

Est-ce que cela pourrait être résolu en utilisant des décalages? Il est un peu difficile d'aider quand nous ne connaissons pas la situation ou à quoi ressemble le balisage.

La classe offset* ajoutera une marge à gauche de votre élément. Peut-être que cela vous aidera?