Changing spacing between elements using responsive? (6 posts)

  1. Nfaccident
    Posted 3 years ago #

    I have been building this site for a client to use for a non fault car accident management company. But am stuck on something that's probably so simple it bugs me. Can I change the spacing between elements so on the contact form page the boxes appear closer together?

    If anyone could point me in the right direction I would really appreciate it!


  2. esmi
    Forum Moderator
    Posted 3 years ago #

    Try asking on the theme's dedicated forum: http://cyberchimps.com/forum/free/responsive/
    You may get a faster & more informed response there.

  3. Joeburger25
    Posted 3 years ago #

    EDIT: Please see below comments before doing this.

    OK, please bear in mind I am a newbie, but I think i have found what you want.

    To find where to edit I went to your page and right clicked on the form and chose "Inspect Element" using my Google Chrome browser. From there I proceeded to try to find the <div> that contained a individual element that you want to bring closer together along with the additional padding underneath it. Then I looked to the right to see what CSS rules it matched. I wasn't sure if margin-bottom was exactly what you were looking for, so I tried just changing it right there in my browser. Sure enough the elements on the page came vertically closer together.

    Refer to this Screenshot i took:


    You need to edit CSS to do what you want.

    The exact line you need to edit is located at:

    line 1245

    change it from

    form div {
    	margin-bottom: .8em;


    form div {
    	margin-bottom: 0em;

    And see how you like it. You may want to change some other things about the spacing, but hopefully this gives you an idea of how to do these things.

    Feel free to ask back here if you have any more questions. I will be watching this thread.

  4. Andrew Nevins
    Forum moderator
    Posted 3 years ago #

    Hi fellow "newbie" Joeburger25,
    We encourage people not to edit the theme files because it causes them headache later on when the theme updates and their changes are erased.

    If it's just a CSS change, you can just recommend people to use a Custom CSS plugin and then create new CSS rather than modify existing CSS.

    Edit: WPyogi, lol.

  5. WPyogi
    Forum Moderator
    Posted 3 years ago #

    You should not modify the theme files as your changes will be overwritten when the theme is updated - but instead use the custom CSS option built into that theme. You can copy the above code to the custom CSS to make the change.

  6. Joeburger25
    Posted 3 years ago #

    Oh I gotcha. That makes sense. Well the above will show him how to figure out what exactly needs changing.

    I use the Responsive theme as well and you can add in custom CSS in the "Theme Options" under Custom CSS Styles.


    All he needs to do is add

    form div {
    	margin-bottom: 0em;

    To this section and it should take precedence over the theme

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic