Menu
I am wondering why the browser shows double open quotes only for the first element. The second element has single quotes instead.
a::before { content: open-quote; }<a href="http://www.google.com">Google</a> <br> <a href="http://www.amazon.com">Amazon</a>
873
If you are an American, using quotation marks could hardly be simpler: Use double quotation marks at all times unless quoting something within a quotation, when you use single. It's different in the greater Anglosphere, where they generally use singles in books and doubles in newspapers.
In traditional printing, all quotation marks were curly. But typewriter character sets were limited by mechanical constraints and physical space. By replacing the curly opening and closing quotes with ambidextrous straight quotes, two slots became available for other characters.
Double quotation marks are used for direct quotations and titles of compositions such as books, plays, movies, songs, lectures and TV shows. They also can be used to indicate irony and introduce an unfamiliar term or nickname.
If you need to put a quotation inside your first quotation, use the opposite type of quotation marks to surround it. That's single quotation marks in American English. Double quotation marks can also be used to show sarcasm or to identify words used as words instead of for their meaning.
The choice between both the types (single quotes and double quotes) depends on the programmer’s choice. Generally, double quotes are used for string representation and single quotes are used for regular expressions, dict keys or SQL.
If you're writing in North America, double quote marks are typically used. However, sometimes a publisher's or an author's style may take precedence over such general preferences.
If you use single quotation marks, then you should use double quotation marks for a quote within a quote. If you use double quotation marks, then you should use single quotation marks for a quote within a quote. For example: "When I say 'immediately,' I mean some time before August," said the manager.
Because single quote after “it” is considered as the end of the string and rest part is not the part of a string. print("It's Python !") It's Python!
Your open quotes are not terminated, so the browser makes the "smart" assumption that you're about to nest your quotes, resulting in double outer quotes for the first element and single inner quotes for the second. This is how quote punctuation works in nested quotations. See Wikipedia and the references to nested quotations therein.
Notably, element boundaries are ignored, so it doesn't matter even if your second element is nested deeper or if both elements are nested in their own parent elements, it will still work the same way, which makes it particularly useful in paragraphs that may contain different kinds and combinations of phrasing elements (a, br, code, em, span, strong, etc, as well as q itself). How quotes are nested depends solely on the number of open-quotes and close-quotes that have been generated at any point in time, and the algorithm is detailed in section 12.3.2 of the CSS2 spec, ending with the following note:
Note. The quoting depth is independent of the nesting of the source document or the formatting structure.
To that end, there are two so-called "solutions" to this problem, both of which involve adding an ::after pseudo-element to balance out the first set of open quotes.
By inserting close quotes using ::after the quotation for the first element is terminated before the second element is encountered so there is no nesting of quotations.
a::before { content: open-quote; } a::after { content: close-quote; }<a href="http://www.google.com">Google</a> <br> <a href="http://www.amazon.com">Amazon</a>If you don't actually want to render close quotes, you can still prevent the browser from generating single quotes for the second element using no-close-quote.
a::before { content: open-quote; } a::after { content: no-close-quote; }<a href="http://www.google.com">Google</a> <br> <a href="http://www.amazon.com">Amazon</a>This is because you didn't close the previous quotes, the next quotes will remain only with one ' .
so use the pseudo element after with content: close-quote
See below snippet:
a::before{ content: open-quote; } a::after{ content: close-quote; }<a href="http://www.google.com"> Google</a> <br> <a href="http://www.amazon.com">Amazon</a> <br> <a href="http://www.google.com"> Google</a> <br> <a href="http://www.amazon.com">Amazon</a>You can also edit the primary and secondary quotes on a tag by using quotes CSS property as follows:
a { quotes: "“" "”" "“" "”"; ^ ^ ^ ^ | | | | | | | |_ #secondary close quotes | | |_____ #secondary open quotes | |_________ #primary close quotes |_____________ #primary open quotes } see below snippet:
a { quotes: "“" "”" "“" "”"; } a::before{ content: open-quote; }<a href="http://www.google.com"> Google</a> <br> <a href="http://www.amazon.com">Amazon</a> <br> <a href="http://www.google.com"> Google</a> <br> <a href="http://www.amazon.com">Amazon</a>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
