Editing customer register page for Dawn theme

[Minako85]

Hi I need some help editing the customer register page (theme:Dawn).

https://amanoutlet.com/account/register

Password : AMANOUTLET

1. I was able to add the radio button but I want it aligned to the left.

2. I would like to add frames to the the 3 drop downs.  

3. I would like to place the "first name" field and "last name" field in 2 columns instead of 2 rows.

Can anybody help with how and where to edit the codes?

Thank you!

[Dan-From-Ryviu]

Hi @Minako85 

You can add this code to finish your 1st and 3rd requests. I don't get your 2nd request.

1. 

.register .field-radio { text-align: left; }

3.

.register .field:nth-of-type(2),
.register .field.grid__half {
    width: 48%;
    margin-bottom: 20px;
}
.register .field:nth-of-type(2) { 
    float: right; 
}
.register .field.grid__half {
    float: left;
}

[Minako85]

Hi @Dan-From-Ryviu 

Thank you for the solution!

Do I add them to the base css? Or to the main-register.liquid?

As for the 2nd question, I meant adding box around each drop downs.  

Many thanks for your help in advance.

[Dan-From-Ryviu]

You can add code to main-register.liquid file, but please wrap my code into <style> elements

<style>
add my code here
</style>

[Minako85]

Thank you！

[Dan-From-Ryviu]

Very welcome

[Minako85]

Hi Dan,

I added the CSS code in the liquid file but the columns ends up not aligned.

Do you know what the problem is?

[Dan-From-Ryviu]

Please update code that you added to this version 

<style>
.register .field-radio { text-align: left; }
.register .field:nth-of-type(2),
.register .field.grid__half {
    width: 49%;
    margin-bottom: 20px;
}
.register .field:nth-of-type(2) { 
    float: right !important; 
    margin-top: 0px !important;
}
.register .field.grid__half {
    float: left;
}
</style>