Centering survey password in simple layout | XM Community
Skip to main content
Question

Centering survey password in simple layout

  • 16 June 2024
  • 2 replies
  • 35 views

Hello, 

I’ve no idea how to center the password text and box. As I’ve expanded the margins of the survey globally to 65%,  it’s appearance is a bit awkward. Any suggestions are welcome.

 

2 replies

Nanditha MM
Rank
Userlevel 4
Badge +11

 

Hi @krzych27 ,

 

Add the below html code in html view 

<!-- Question Text -->
<p>Please enter your password below:</p>

<!-- Password Field -->
<div class="center-password-container">
  <label for="password">Password:</label>
  <input type="password" id="password" name="password">
</div>


and css code in custom css
 

.center-password-container {
  text-align: center !important;
}

.center-password-container input[type="password"] {
  display: inline-block !important;
  margin: 0 auto !important;
}
 

 

Thank you

Tom_1842
Rank
Userlevel 7
Badge +27

I think this post is referring to the Password protection toggle found in Survey Options --> Security, so I don't think creating an html password input field will work here. Adding the below CSS to the Style section of the Look & Feel is working on my end to center the password field and text in Simple layout:

#question-display-wrapper-Password {
text-align: center;
}

#question-Password > div > div > div > div > div.question-content > div {
margin: auto;
}

#question-display-Password {
max-width: 100%;
}

 

Leave a Reply


Terms & Conditions