I have two questions.

Can you ask a question asking, How many children do you have? Once a user enters number create an text array for each entry?

also, and the most important. Create a dropdown for each of the children allowing them the select the a country of birth for each.

1) You can create a separate text array for each child and use relevance or conditions to show them as required.

2) You will need to create separate select-dropdown questions for each child and use JavaScript to move the dropdowns into the array(s).

Let me give this a try. are there any examples of on these that i can use as a reference?

I don't know of any examples that exactly meet your requirements but this post may give some inspiration - www.limesurvey.org/en/forum/design-issue...to-text-input#102550 .



.

for the newbie question, I found the Multiple question types in array in www.limesurvey.org/manual/Workarounds:_Q...ayout_and_templating and it fit was i was looking for. I modified it to take 6 fields instead of 5 and i having problems with the alignment. No matter what i try, i cant seem to get the fields width of the dropdows or text fields to close on the right side. Have troed padding, margins and what ever else i could think of. but have failed. i have also made the width of the survey larger and that does not. additionally, when i type in the fields, they overlap.

[img size=200x200] www.dropbox.com/s/khnncj4d1n6vdvo/css.PNG?dl=0 [/img]


[img size=200x200] www.dropbox.com/s/1ef6vjtta4j0zhg/css2.PNG?dl=0 [/img]

What setting are supposed to be changed for these adjustment?

Can you activate a test survey so we can see the source?

Behing a firewall with no outside access.

but i have exported the question.

I set the column width individually to have more control. and have been playing whit each of the settings.

here is the source.

script type="text/javascript" charset="utf-8">

$(document).ready(function() {
// Call the "sideBySide" function with number of rows, columns and start position
sideBySide(2, 6, 1);
});

function sideBySide(rows, columns, startQuestion) {

/*********** Display multiple questions side by side ***********/

if ($('div.qRow1').length == 0) {

var rowNum = 0;
var colNum = 1;
var rowList = new Array();

//////// Add question classes for later use ////////

// Loop through all questions and add row and column specific classes
$('div[id^="question"]').each(function(i) {
if(i >= (startQuestion-1) && rowNum < rows) { // This IF condition only needed if there are questions before or following the "inline" questions
$(this).addClass('qRow'+rowNum+'').addClass('qCol'+colNum+'').addClass('inlineQuestion');
if(rowNum == 0 && colNum > 1) {
$(this).addClass('columnLabel');
}
if(rowNum > 0 && colNum == 1) {
$(this).addClass('rowLabel');
}
else if(rowNum > 0 && colNum > 1) {
$(this).addClass('questionCell');
}
if(colNum == columns) {
rowList.push('qRow'+rowNum+'');
rowNum++;
colNum = 1;
}
else {
colNum++;
}
}
else {
$(this).addClass('normalQuestion');
}
});

//////// Survey layout manipulation ////////

// Fix the width of the survey
$('table.outerframe').css({
'width': '900px'
});

// Wrap each "row" in a wrapper div
$(rowList).each(function(i) {
$('.'+this+'').wrapAll('<div id="inlineWrapper'+i+'" class="inlineRow" />');
});

// Style the wrapper divs
$('.inlineRow').css({
'width': '900px',
'margin': '0 auto 0 auto',
'clear': 'both'
});

$( '.inlineRow:first' ).css({
'margin-top': '10px'
});

// Get all the questions to sit politely side by side
$( '.inlineQuestion' ).css({
'float': 'left',
'height':'41px',
'overflow':'hidden',
'margin-bottom': '-8px'
});
$( '.inlineQuestion .questionhelp' ).hide();
$( '.inlineQuestion .survey-question-help' ).parent().hide();

// A little space under the last row
$( '.inlineRow:last .inlineQuestion' ).css({
'margin-bottom': '10px'
});

// Any questions not displayed inline (this is only needed if there are questions following the "inline" questions)
$( '.normalQuestion' ).css({
'clear': 'both'
});

//////// Column manipulation ////////

// Set the column widths - can be set individually if necessary
// Must add up to less than 100%
$( '.qCol1' ).css({
'width': '100px',
'padding': '0px 0px'
//'width': '10%'
});

// First Name Column
$( '.qCol2' ).css({
'width': '100px',
'margin-left': '5',
'margin-right': '5',
'padding': '2px 2px',
//'width': '20%'
});

//Last Name Column
$( '.qCol3' ).css({
'margin-left': '5',
'margin-right': '5',
'padding': '2px 2px',
'width': '150px'
//'width': '20%'
});

//Date of Birth Column
$( '.qCol4' ).css({
'width': '180px',
'padding': '0px 0px'
//'width': '10%'
});

//Place of Birth Column
$( '.qCol5' ).css({
'width': '20%'
});

//Status Column
$( '.qCol6' ).css({
'width': '180px',
//'width': '20%'
});

//$( '.qCol2, .qCol3, .qCol4, .qCol5, .qCol6' ).css({
// 'width': '22%'
//});

//////// Question manipulation ////////

// Hide the answer element in boilerplate questions
$( 'div.boilerplate td.answer' ).parent().hide();


// Hide the question text elements in non-boilerplate questions
$('div.questionCell td.questiontext').parent().hide();

// Push the question tables to 100%
$( 'div.inlineRow table' ).css({
'width': '100%'
});

// Get everything to line up nicely vertically
$( '.inlineQuestion td.questiontext, .inlineQuestion td.answer p' ).css({
'text-align': 'center'
});

// Adjust cell heights so everything lines up nicely horizontally
$( '.inlineQuestion td.answer, .inlineQuestion td.questiontext' ).css({
'height':'35px',
'overflow':'hidden',
'padding':'0.5em'
});
$( '#inlineWrapper0 .inlineQuestion' ).css({ 'height':'50px' });
$( '#inlineWrapper0 td.questiontext' ).css({
'height':'50px'
});

// Yes-no question styles
/* $( 'div.yes-no ul' ).css({
'text-align': 'center',
'font-size': '90%',
'margin': '0',
'padding-bottom': '5px'
});
$( 'div.yes-no li' ).css({
//'padding-right': '1.5em'
'padding-right': '0'
});
$( 'div.yes-no td.answer' ).css({
'padding-bottom': '0'
}); */

// Short-text question styles
$( 'div.text-short input' ).css({
'width': '100px',
'padding': '0px 0px',
'margin-left': '0'
});


// Date/Time question styles
$( 'div.date/time input' ).css({
'width': '225px',
'margin-left': '0'
});
$( 'div.date/time p.tip' ).css({
'display': 'none'
});

// // Numeric question styles
// $( 'div.numeric input' ).css({
// 'width': '125px',
// 'margin-left': '0'
// });
// $( 'div.numeric p.tip' ).css({
// 'display': 'none'
// });

// Get rid of the margins around select boxes
$( 'p.question' ).css({ 'margin':'0' });
}
}
</script>

Sorry, that doesn't help. We would need to see a live version to determine which styles are affecting the rendering.

let me see what i can do.

If your survey is hosted locally you can upload it at our demo: demo.limesurvey.org/admin

Please post the link here afterwards and note that the demo system is cleaned up regularly.