BuddyBoss Home – Web › Support Forums › Solutions › Social MarketPlace › Styling Account Registration with Custom profile fields

Viewing 7 posts - 1 through 7 (of 7 total)

  • Question

    March 27, 2016 at 1:13 pm #65547

    Macarius
    @donmacarius

    @vapvarun, @zarko, I have added some extra fields to my Registration page and it now looks very very long. I need to display the Profile Details besides the Account Details to avoid scrolling. I tried the following CSS but had no luck.
    #buddypress .standard-form #basic-details-section, #buddypress .standard-form #blog-details-section, #buddypress .standard-form #profile-details-section, #buddypress .standard-form .security-question-section{
    width:20%; float:left;}

    #register-page .register-section, #register-page .security-question-section{
    background-color: #ffffff;
    border: 1px solid #ddd;
    border-radius: 3px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    //* clear: both;*/
    float: left !important;
    font-weight: 400;
    margin: 0 auto 25px !important;
    /*max-width: 400px;*/
    padding: 24px;
    text-align: left;
    width: 40% !important;
    }

    Please see image attached to understand how long my Registration page has become and the need to display them besides each other.

    Thanks

    Answers

    March 28, 2016 at 12:01 pm #65662

    Anonymous
    @

    Hi @donmacarius, It looks fine at our end please provide your website link to provide you exact css code to remove the extra box layout in each section.

    Regards

    March 28, 2016 at 12:21 pm #65675

    Macarius
    @donmacarius

    Hi @pallavi, please see my site: http://africantailor.myfashionafrica.com/register/

    March 28, 2016 at 12:47 pm #65687

    Anonymous
    @

    Hi @donmacarius, Please try this css code:

    
div#register-page #basic-details-section input {
    height: 30px !important;
    margin-bottom: 20px !important;
}
div#register-page .register-section, div#register-page .security-question-section {
    padding: 10px 15px !important;
}

    Regards

    March 28, 2016 at 1:03 pm #65698

    Macarius
    @donmacarius

    Hi @pallavi, Thanks for the help but that didn’t solve my problem. Please see the image attached. I want to display them besides each other so the user doesn’t have to scroll.

    See image attached.

    March 28, 2016 at 11:58 pm #65739

    Anonymous
    @

    Hi @donmacarius, Okay we will provide you correspond css to make the box in same line..as it is custom work therefore, will take little time…

    I will get back to you in next 24hours..

    Regards

    March 29, 2016 at 6:21 am #65786

    Anonymous
    @

    Hi @donmacarius, Please add this css code:

    
@media screen and (min-width:767px){
#register-page #basic-details-section, div#register-page #profile-details-section.register-section, #buddypress #register-page .security-question-section {
  clear: none !important;
  float: left !important;
  margin-right: 2% !important;
  width: 32% !important;
}
}

    Regards

Viewing 7 posts - 1 through 7 (of 7 total)
  • The question ‘Styling Account Registration with Custom profile fields’ is closed to new replies.