Insert HTML from CSS

HtmlCss

Html Problem Overview

Is there any way to insert an HTML element, dom or code from CSS(3)?

Html Solutions

Solution 1 - Html

No. The only you can do is to add content (and not an element) using :before or :after pseudo-element.

More information: http://www.w3.org/TR/CSS2/generate.html#before-after-content

Solution 2 - Html

Content (for text and not html):

http://www.quirksmode.org/css/content.html

But just to be clear, it is bad practice. Its support throughout browsers is shaky, and it's generally not a good idea. But in cases where you really have to use it, there it is.

Solution 3 - Html

No you cannot. The only thing you can do is to insert content. Like so:

p:after {
    content: "yo";
}

Solution 4 - Html

An alternative - which may work for you depending on what you're trying to do - is to have the HTML in place and then use the CSS to show or hide it depending on the class of a parent element.

OR

Use jQuery append()

Solution 5 - Html

This can be done. For example with Firefox

CSS

#hlinks {
  -moz-binding: url(stackexchange.xml#hlinks);
}

stackexchange.xml

<bindings xmlns="http://www.mozilla.org/xbl"
  xmlns:html="http://www.w3.org/1999/xhtml">
  <binding id="hlinks">
    <content>
      <children/>
      <html:a href="/privileges">privileges</html:a>
      <html:span class="lsep"> | </html:span>
      <html:a href="/users/logout">log out</html:a>
    </content>
  </binding>
</bindings>

ref 1

ref 2

Categories
Recommended Html Solutions
Recommended Css Solutions

Previous Solution:

Bundler throws uninitialized constant Gem::SilentUI (NameError) error after upgrading to Rubygems 1.5.0

RubyRubygemsBundler

Next Solution:

JavaScript error: "val.match is not a function"

JavascriptMatch

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionmethylView Question on Stackoverflow
Solution 1 - HtmlSotirisView Answer on Stackoverflow
Solution 2 - HtmlfiivView Answer on Stackoverflow
Solution 3 - HtmlalexnView Answer on Stackoverflow
Solution 4 - HtmlStuView Answer on Stackoverflow
Solution 5 - HtmlZomboView Answer on Stackoverflow