search

thoughtbot / carnival

An unobtrusive, developer-friendly way to add comments
MIT License
501 stars 30 forks source link

Nesting between article/block can cause problems with vertical alignment #236

Closed pbrisbin closed 6 years ago

pbrisbin commented 9 years ago

Given something like:

<article>
  <h1>
  <div>
  <div>
  <div class="content">
    <p>
    <pre>
    <!-- ... -->

And Carnival configured with a block_selector of .content > p, the alignment of the comments UI will be off by the distance between the article and the .content element. This can be partially corrected by setting a custom top on .carnival, but that's no robust in the presence of wrapping text (see #201).

A more robust workaround is to not configure the block_selector, but instead set article_selector to .content and set a top: 0 on .carnival.

In general, Carnival should be smarter about placing the comment UI in the presence of nested markup such as this.