Edit width of "how did you hear about us" dropdown

[erika71690]

I've added a "how did you hear about us?" dropdown menu to my checkout, however it spans the entire width of the screen which is not very attractive. I'd like it to be right-aligned and about a third of the size so it lines up with the checkout info above it.

www.trinketbk.com 

[JHKCreate · Accepted solution]

Hi @erika71690 

Add the following code to your theme.scss.liquid file:

@media only screen and (min-width: 750px)
{
select#how-did-you-hear-about-us {
    width: 33%!important;
}
}

That should do it! Let me know

[erika71690]

Thank you so much! That worked perfectly to adjust the size. Is it possible to align it to the right side as well? I'm not super stuck on this, so if it's not possible that's ok. Figured I'd try and ask though!

[Ninthony · Accepted solution]

label#how-did-you-hear-about-us--label {
    text-align: right;
    margin-top: 20px;
}

span#how-did-you-hear-about-us--error {
    text-align: right;
}

select#how-did-you-hear-about-us {
    margin-left: auto;
}

[UmairA · Accepted solution]

Hey @erika71690,

Add the following code instead of the one provided by a fellow.

@media only screen and (min-width: 750px)
{
.template-cart #shopify-section-cart-template div.form-vertical {
     float: right !important;
     width: 33% !important;
}
}

Hope that helps!

[erika71690]

Thank you so much! That worked perfectly.

[Ninthony]

Hi @erika71690 , could you also mark @JHKCreate 's answer as a solution? I did not mean to steal their thunder and they helped you out first.