Capitalize First Letter of Sentences CSS

Capitalize first letter of sentences CSS

You can capitalize the first letter of the .qcont element by using the pseudo-element :first-letter.

.qcont:first-letter{
  text-transform: capitalize
}

This is the closest you're gonna get using only css. You could use javascript (in combination with jQuery) to wrap each letter which comes after a period (or comma, like you wish) in a span. You could add the same css as above to that span. Or do it in javascript all together.

Here's a snippet for the css approach:

.qcont:first-letter {  text-transform: capitalize}

<p class="qcont">word, another word</p>

Making first letter of each sentence uppercase

Appears to be due to using SCSS syntax when it looks like you might be talking about SASS (based on the question tag).

In SASS, the mixin would be defined as:

-sentence-case()
  text-transform: lowercase

  :first-letter
    text-transform: uppercase


.sentenceCase
  +sentence-case()

In SCSS, the mixin would be defined as:

@mixin sentence-case() {
  text-transform: lowercase;

  &:first-letter {
    text-transform: uppercase;
  }
}

.sentenceCase {
  @include sentence-case();
}

And in either case you would then assign the .sentenceCase class to an element with:

<p class="sentenceCase"></div>

Which results in:

.sentenceCase {  text-transform: lowercase;}.sentenceCase:first-letter {  text-transform: uppercase;}

<p class="sentenceCase">our first sentance</p>
<p class="sentenceCase">our second first sentance</p>

Make first letter capital in sentence which is occuring after blank space and first letter by CSS

HELLO I AM HERE

Since your string is all capitalized, you can't really do it with CSS alone without tedious wrapping of each word in a  tag, but JS can do the trick:

var nodes = document.querySelectorAll('.test');
Array.prototype.forEach.call(nodes, function(node) {  node.textContent = node.textContent.split(' ').map(function(word) {    return word[0].toUpperCase() + word.slice(1).toLowerCase();  }).join(' ');});

<p class='test'>HELLO I AM HERE</p><p class='test'>HELLO I AM HERE AGAIN</p><p class='test'>HELLO I AM HERE AGAIN AND AGAIN</p>

Replace first letter of sentence in HTML tags with capital letter

You can use .html(function), String.prototype.replace() with RegExp /((^|\.)|(\.(?:\s+| (?:\s+))| ))[a-z]/g to match first a-z character at beginning of string or . followed by a-z or . followed by a-z, or . followed by followed by space a-z or a-z, or   followed by a-z; String.prototype.slice(), String.prototype.indexOf() to handle non-breaking space character , String.prototype.toUpperCase()

var re = /((^|\.)|(\.(?:\s+| (?:\s+))|<br>))[a-z]/g;
$("h3, p").html(function(_, html) {  return html.replace(re, function(match) {    var space = " ";    return match.indexOf(space) > -1            ? match.slice(0, match.indexOf(";"))              + match.slice(match.indexOf(";") + 1).toUpperCase()           : match.toUpperCase();  })})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><h3 class="media-heading">description</h3>    <p>there is a john entrance hall with staircase, beautiful lounge with stone fireplace and wood-burner, exposed at stone walls and beams. kitchen/ dining room, is huge room with fitted kitchen, wood burner and dining area with doors to the terrace.  upstairs there are 3 double bedrooms, the master with en-suite bathroom, family shower room and a landing.there is a self contained apartment, with private terrace, (which could be incorporated into the house,) which has a lounge, bedroom, kitchen and shower room.the cottage/gite has an entrance hall, lounge with fireplace, fitted kitchen, 4 bedrooms, bathroom and shower room. outside there is a  private garden and solar shower.  rental is very popular in the summer in this region and this gite could be rented out for over £1000 per week.<br _moz_dirty="true"></p><p>paragraph break<br>line break</p>

Capitalize First Letter of Sentences CSS