Faire séparateur vertical css

J'ai besoin d'aide avec faire des doubles lignes verticales.

Faire séparateur vertical css

Voici styles:

.slide-container
{
    text-align: center;
    width: 25%;
}

.v-separator
{
    content: "";
    display: inline-block;
    width: 0px;
    height: 230px;
    border-right: 1px solid #fafafa;
    border-left: 1px solid #b4b4b4;
    padding: 0;
    position: relative;
    top: 20px;
}

.v-separator a la largeur 2px en raison de la frontière, ce qui provoque le problème. J'ai essayé de faire .slide-container largeur d'un peu moins de 25% (comme 23.853%), mais ce n'est pas la décision.

Je n'ai aucune idée de comment mettre en œuvre cette fonctionnalité en quelque sorte d'autre.

Btw, je suis à l'aide de la Fondation 5 et d'une Boussole.

violon qui illustre le problème: http://jsfiddle.net/5w7Hr/

était une faute de frappe. Je suis en train de faire double ligne verticale (comme je l'ai fait sur la photo) qui peut s'appliquer ici. Peut-être que je ne peux pas l'expliquer clairement le problème, parce que je suis très fatiguée avec elle.
pouvez-vous créer un violon pour votre code?
Ok, l'a obtenu. ceci bien?
Bon coup. Juste eu ceci un...
C'est un double de soi, donc de nombreuses questions.

OriginalL'auteur VIRUS | 2014-07-26

  1. 9

    La width:25% en général ne comprennent pas les marges et les frontières. Lorsque tous ces éléments sont ajoutés ensemble de la largeur dépasse les 100%. C'est la raison pour laquelle la dernière case est poussé vers le bas. Vous pouvez résoudre ce problème en ajoutant box-sizing réglage comme indiqué ci-dessous.

    Remarque: Éléments dont l'affichage est inline-block par défaut, la marge attribuée et nous avons donc de compenser ce également par l'attribution d'une marge négative (Source: CSS Astuces). Alternativement, à l'aide de float: left au lieu de display: inline-block est également une bonne option.

    #wrapper
{
    width: 600px;
    background: lime;
    box-sizing: border-box;
}

.slide-container
{
    text-align: center;
    width: 25%;
    display: inline-block;
    margin: 0px -4px;
}

    Démo

    Pourquoi la baisse de voter? Veuillez expliquer qu'elle soit corrigée.
    Je n'ai pas voté du tout encore.
    Au lieu de répondre à une double question, il est préférable de simplement marquer.
    Suis-je supposer que vous étiez celui qui-a voté? Auquel cas, ne vaudrait-il pas mieux se contenter de drapeau de la question? Si la question est supprimée, alors la réponse qui va avec aussi. Downvoting une réponse pour cette raison, rend la réponse de regarder comme si c'est faux. A partir de maintenant, je ne vois pas de fermer/double vote sur la question.
    notez que la valeur par défaut de la marge entre la inline-block éléments est fonction de parent de l'élément taille de police. Il a la largeur d'un espace char.

    OriginalL'auteur Harry