Reducing space between radio buttons in matrix and horizontal multi select questions

Alina_shaulov
Can you include a picture of which space you're trying to reduce ?
Presuming it's matrix at the top and multi-select at the bottom try using the below by replacing Question ID. Include the below code in CustomCSS> Look and Feel.
 .Skin .QuestionOuter.BorderColor.Matrix.mf.QID18 {
    padding-bottom: 0vh;
}
Hope it helps!

Sure.
I have these two question types. I'd like to make them as compact a possible, so I'm interested in reducing the space between the answers themselves (meaning having the radio buttons closer to each other) and also minimizing the hight and width of the question.
My purpose is to fit those questions horizontally inside the creative of a pop up survey.
Thanks in advance :)

Alina_shaulov
For the matrix question I would recommend adding labels instead of adding it in the statement things like (Not Satisfied, Very Satisfied etc.)
Something like this:
Also, changing the look and feel settings to Compact
Lastly, add the below code within Custom CSS-> Look n Feel. You can change the % as required.
.Skin .QuestionBody table.ChoiceStructure {
    width: 70% !important;
}
Preview:

Hope it helps!

Thanks ! that's very helpful!
Is there also a code I can use to "shrink" the hight of the question?
For example, this is how each statement's of the matrix rating looks like when I test the survey pop up, and I'd like the answers to be presented horizontally instead of vertically.

Thanks again :)

Alina_shaulov
Where are you testing it specifically in mobile? As on the desktop it looks fine.
You can disable mobile friendly option if you are facing issues in that manner.
Also in the same css you can include height as well along with width.
P. S: You have tagged wrong deepak.
Hope it helps!

Thanks!!
Do you maybe know if I can somehow change width/height of each statement individually in a matrix question?

Alina_shaulov
You can change the width and height for all the statements with the below code in custom CSS
span.LabelWrapper label>span {
height: 50px;
width: max-content; /*Can mention in % as well*/
}
You can do the same via javascript for a particular question.
Qualtrics.SurveyEngine.addOnload(function()
{
jQuery('#QID18').find('span.LabelWrapper.table').css({'width':'max-content','height':'50px'});
});
To change for each statement you can use the below code.
Qualtrics.SurveyEngine.addOnload(function()
{
document.getElementById('QID18').querySelectorAll('span.LabelWrapper.table')[0].style.width='max-content';
document.getElementById('QID18').querySelectorAll('span.LabelWrapper.table')[0].style.height='50px'
});
change the [0] to 1,2,3.. as required on different statements. Also change the QID as per your question.
Hope it helps!

Thanks very much!!