Poll
Print screen without any additonal CSS in Internet Explorer
Print screen without any additonal CSS in Firefox
The module displays differently in IE and Firefox. We want to style them equally.
Structure with classes and id's
div.moduletable_voorbeeld
h3 Enquête
form
table.poll_voorbeeld (width;95% align:center)
thead tr td (font-weight: bold) Joomla wordt gebruikt voor?
tr td (align:center)
table.pollstableborder_voorbeeld
tr
td.sectiontableentry2_voorbeeld input#voteid1
td.sectiontableentry2_voorbeeld label Community websites
tr
td.sectiontableentry1_voorbeeld input#voteid2
td.sectiontableentry1_voorbeeld label Publieke websites
tr
td.sectiontableentry2_voorbeeld input#voteid3
td.sectiontableentry2_voorbeeld label eCommerce
tr
td.sectiontableentry1_voorbeeld input#voteid4
td.sectiontableentry1_voorbeeld label Blogs
tr td (align:center)
div (align:center)
input.button (Stem) input.button (Resultaten)
CSS
div.moduletable_voorbeeld {
margin: 0 0 15px 0;
}
div.moduletable_voorbeeld h3 { }
div.moduletable_voorbeeld form { }
table.poll_voorbeeld { }
table.poll_voorbeeld td {}
table.pollstableborder_voorbeeld {
text-align: left;
font-size: 11px;
margin-bottom: 10px;
}
table.pollstableborder_voorbeeld td.sectiontableentry2_voorbeeld {
background-color: #cccccc;
}
table.pollstableborder_voorbeeld td.sectiontableentry2_voorbeeld input#voteid1 { }
table.pollstableborder_voorbeeld td.sectiontableentry2_voorbeeld label { }
table.pollstableborder_voorbeeld td.sectiontableentry1_voorbeeld { }
table.pollstableborder_voorbeeld td.sectiontableentry1_voorbeeld input#voteid2 { }
table.pollstableborder_voorbeeld td.sectiontableentry1_voorbeeld label { }
Print screen after applying CSS in IE
Print screen after applying CSS in Firefox
Poll results.
Structure with classes and id's
form#poll
div.componentheading Joomla wordt gebruikt voor?
div.contentpane label Selecteer enquête select.inputbox#id
div.contentpane
table.pollstableborder
th.sectiontableheader img (poll.png) (align:middle width:12 height:14) Joomla wordt gebruikt voor?
tr.sectiontableentry0
td Publieke websites
tr.sectiontableentry0
td (align:right width:25) 13
td (width: 30) 50%
td (width:300)
div.polls_color_1 (height:4px width:50%)
tr.sectiontableentry1
td Community websites
tr.sectiontableentry1
td (align:right width:25) 5
td (width: 30) 19.2%
td (width:300)
div.polls_color_2 (height:4px width:19.2%)
tr.sectiontableentry0 Etc.
table
tr
td.smalldark Aantal stemmen
td.smalldark 26
tr Etc.
CSS
form#poll {
text-align: left;
}
div.componentheading { }
div.contentpane { }
table.pollstableborder { }
table.pollstableborder th.sectiontableheader {
padding-bottom: 10px;
}
table.pollstableborder th.sectiontableheader img { }
table.pollstableborder tr.sectiontableentry0 {
font-size: 10px;
}
table.pollstableborder tr.sectiontableentry1 { }
div.polls_color_1 { }
div.polls_color_2 { }
div.polls_color_3 { }
/* div.polls_color_etc */
table td.smalldark { }
Print screen after applying CSS
