line break between image and contact form

Hi

Can you please post your site address here?

Thanks

Here is an example:
https://rivermudlife.com/folding-coral-colored-table/

If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then install this Custom CSS Manager plugin https://www.ads-software.com/plugins/custom-css-manager-plugin

Then use its “CSS Code” section of the dashboard to hold your CSS modifications:

Alternatively use your Child Theme style.css file to hold your CSS modifications:

form.wpcf7 {
    clear: both;
}

Hi. Thanks. I’m not really sure what any of that means.

Would it help if there were numbers in front?

1. install this Custom CSS Manager plugin https://www.ads-software.com/plugins/custom-css-manager-plugin
2. Then use its “CSS Code” section of the dashboard to hold your CSS modifications:

3. form.wpcf7 {
       clear: both;
   }

@andrew Thanks for helping. The theme already has a “Custom CSS” section. ??

@southern_water You don’t have to install the plugin. You can simply add the Custom css Andrew provided to Appearance > Customize > Miscellaneous > Custom CSS.

Thank you @andrew and @layerthemes; however the issue is not resolved.

Input the css code provided by Andrew into the section specified by LayerThemes with no change in appearance.

Not sure if you can see the screen shot from this link or not:
https://rivermudlife.com/wp-content/uploads/2015/08/Screen-Grab-Contact-Form-issue.tiff

Hi

It seems perfect from my end. Maybe because of caching plugin changes took time to take effect. Make hard refresh CTRL + F5 and see if the issue is still there.

Screenshot: https://imgur.com/pDY03zP

Thanks

@southern_water you’re seeing this because the pictures are being floated and hasn’t been cleared.
How do I insert a line break between the images and the beginning of the contact form? insert

form.wpcf7 {
    clear: both;
}

and you’re problem is solved.

Thanks @layerthemes. From your image it appears to be laying as desired for you. However, for me on both Safari and Chrome the contact form is still wedged between the right column and the pictures. I’ve tried placing all sections in <p>/</p> as well as
and
and   to no avail. I will try on an Explorer browser tomorrow. Thanks.

@southern_water whats your screen size?

Viewed on 14″ MacBook, 21″ iMac and iPad 2.

Checked it out on Internet Explorer. Contact form still starts on the edge of the top row of pictures. Perhaps I am not inserting pictures correctly.

@southern_water
Try adding this to your Custom CSS:

div.wpcf7 {float: left;margin-top: 30px;width: 100%;}

Regards

Worked like a champ. Many thanks layerthemes. Earned a customer.