One out of four radio buttons hidden
<p>I have four sets of radio buttons, each set wrapped in a div called "choiceSet". On firefox for windows I see all four sets of radio buttons. My coworker only sees three sets in firefox. Both of us see only 3/4 sets in chrome. In linux I don't see the offending set of radio buttons regardless of the browser. </p>

<p>Any ideas? Whenever I have a problem like this in Python it turns out that I used a reserved word for something. </p>

<p>The html is here: 
<a href="https://github.com/melvyniandrag/SentimentLabeler/blob/master/mysite/polls/templates/polls/detail.html" rel="nofollow">https://github.com/melvyniandrag/SentimentLabeler/blob/master/mysite/polls/templates/polls/detail.html</a></p>

<p>Here is the offending html/django:</p>

<pre><code>&lt;div class="choiceSet"&gt;
    &lt;h3&gt;Ad?&lt;/h3&gt;
    {% for advertisement in question.advertisement_set.all %}
        {% if 'not' in advertisement.ad_text %}
            &lt;input type="radio" name="advertisement" id="advertisement{{ forloop.counter }}" value="{{ advertisement.id }}" checked/&gt;
        {% endif %}
        {% if 'not' not in advertisement.ad_text %}
            &lt;input type="radio" name="advertisement" id="advertisement{{ forloop.counter }}" value="{{ advertisement.id }}" /&gt;
        {% endif %}
        &lt;label for="advertisement{{ forloop.counter }}"&gt;{{ advertisement.ad_text }}&lt;/label&gt;&lt;br /&gt;
    {% endfor %}
&lt;/div&gt;
</code></pre>

<p>which becomes:</p>

<pre><code>&lt;div class="choiceSet"&gt; 
    &lt;h3&gt;Ad?&lt;/h3&gt;
    &lt;input type="radio" class="radiobutton" name="advertisement" id="advertisement1" value="17" /&gt;
    &lt;label for="advertisement1"&gt;advertisement&lt;/label&gt;&lt;br /&gt;
    &lt;input type="radio" class="radiobutton" name="advertisement" id="advertisement2" value="18" checked/&gt;
    &lt;label for="advertisement2"&gt;not advertisement&lt;/label&gt;&lt;br /&gt;
&lt;/div&gt;
</code></pre>

<p>the css is here: <code><a href="https://github.com/melvyniandrag/SentimentLabeler/blob/master/mysite/polls/static/polls/detail.css" rel="nofollow">https://github.com/melvyniandrag/SentimentLabeler/blob/master/mysite/polls/static/polls/detail.css</a></code></p>

<p>If you </p>

<pre><code>git clone https://github.com/melvyniandrag/SentimentLabeler.git
cd mysite
python manage.py runserver
open 127.0.0.1:8000
login a/password
</code></pre>

<p>you will see the problem.</p>

<p>This was pretty interesting :)</p>

<p>I was able to reproduce this. The problem is that the second choiceSet  has radio buttons with id "advertisement*", which triggers the AdBlockPlus Plugin in chrome and automatically hides that div, acting as a false positive!</p>

<p>Here is a small proof:</p>

<p><a href="http://i.stack.imgur.com/csMHa.gif" rel="nofollow"><img src="http://i.stack.imgur.com/csMHa.gif" alt="enter image description here"></a></p>

<p><a href="http://i.stack.imgur.com/FwjKZ.png" rel="nofollow"><img src="http://i.stack.imgur.com/FwjKZ.png" alt="enter image description here"></a></p>

<p>The solution is just to change the value of id to something like "adv-mnt1"</p>

python html css django