CSS: jak dodać spację przed zawartością elementu?

Żaden z poniższych kodów nie działa:

p:before { content: " "; }
p:before { content: " "; }

Jak dodać spację przed zawartością elementu?

Uwaga: muszę pokolorować obramowanie po lewej stronie i margines po lewej stronie do celów semantycznych i użyć spacji jako bezbarwnego marginesu. :)

Możesz użyć unikodu nierozdzielającej spacji:

p:before { content: "\00a0 "; }

Zobacz demo JSfiddle

[styl ulepszony przez @Jason Sperske]

Nie pierdź, wstawiając spacje. Po pierwsze, starsze wersje IE nie będą wiedzieć, o czym mówisz. Poza tym ogólnie istnieją czystsze sposoby.

W przypadku wcięć bezbarwnych użyj text-indentwłaściwości.

p { text-indent: 1em; }

Demo JSFiddle

Edytować:

Jeśli chcesz, aby przestrzeń była pokolorowana, możesz rozważyć dodanie grubej lewej krawędzi do pierwszej litery. (Prawie - ale nie - powiedziałbym „zamiast tego”, ponieważ wcięcie może stanowić problem, jeśli używasz obu. Ale to dla mnie nieprzyjemne, gdybym polegał wyłącznie na granicy wcięcia.) Możesz określić, jak daleko i jak szeroki jest kolor przy użyciu lewego marginesu / dopełnienia / szerokości obramowania pierwszej litery.

p:first-letter { border-left: 1em solid red; }

Próbny

Ponieważ chcesz dodać odstępy między elementami, możesz potrzebować czegoś tak prostego, jak margines lewy lub dopełnienie lewy. Oto przykłady zarówno http://jsfiddle.net/BGHqn/3/

Spowoduje to dodanie 10 pikseli po lewej stronie elementu akapitu

p {
    margin-left: 10px;
 }

lub jeśli chcesz po prostu dopełnić element akapitu

p {
    padding-left: 10px;
}

/* Most Accurate Setting if you only want
   to do this with CSS Pseudo Element */
p:before { 
   content: "\00a0";
   padding-right: 5px; /* If you need more space b/w contents */
}