Tuesday, July 10, 2012

javascript – How to reduce amount of space between lines of text



In fiddle I\’m attempting to reduce the amount of space between each sentence in each question option (options are the blue text):


http://jsfiddle.net/25LjE/79/


I\’m reducing the height of class pds-answer-group using the line-height property :



.pds-answer-group {
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
height:auto;
overflow:hidden;
line-height:50%;
}


But the amount of space between the lines is not being reduced. How can the CSS be updated to reduce the amount of space between each line of text for the question options?


CSS behind the fiddle:



.pds-question-top {
font-size:10pt !important;
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
}

.pds-pd-link, .pds-comments {
display:none !important;
}

.pds-box {
width:220px !important;
}

.pds-input-label {
width:85% !important;
}

.PDS_Poll {
margin-bottom:15px;
}

.pds-answer-span {
color:#00f;
}

.pds-vote {
background-color:#424242;
}

.pds-answer-text {
color:#00f;
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
}

.pds-answer-feedback {
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
}

.pds-votebutton-outer {
text-align:center;
}

.pds-answer-group {
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
height:auto;
overflow:hidden;
}

.pds-input-label,.pds-answer-input {
float:left;
}

.pds-view-results,.pds-links {
color:#FFF !important;
padding-top:1px !important;
padding-bottom:1px !important;
margin-top:1px !important;
margin-bottom:1px !important;
}

.pds-comments,.pds-return-poll {
color:#FFF !important;
}

.pds-links {
display: inline !important;
}
.pds-pd-link {
display: none !important;
}
.pds-box {
width: 220px !important;
}
.pds-input-label{
width: auto! important;
}
.PDS_Poll{
margin-bottom:15px;
}

.pds-question-top {padding:0 !important}


HTML behind the fiddle:



<script type=\"text/javascript \" charset=\"utf-8\" src=\"http://static.polldaddy.com/p/6352993.js \"></script>
<noscript><a href=\"http://polldaddy.com/poll/6352993/\">This is very long test question to test how polldaddy handles questions that exceed that normal length............ yes a very long question indeed..............</a></noscript>

$(document).ready(function() {

$(\'.pds-question-inner\').prepend(\'<span style=\"color:red;font-weight:bold;font-size: 15px;float:left\">Header</span>\');
});






Rating: 3 out of 5 based on 4 ratings


The post javascript – How to reduce amount of space between lines of text appeared first on Javascript ASK.






via Javascript ASK http://javascriptask.phpfogapp.com/javascript-how-to-reduce-amount-of-space-between-lines-of-text.html

No comments:

Post a Comment