Newbie to CSS – How to find the right element?
Question
I have spent the larger part of the past hour trying to figure out the right element to override my theme’s styling of Contact Form 7 but haven’t progressed farther than scratching my head in confusion.
Here’s the code when I ‘inspected’ the webpage:
<div class="elementor-widget-wrap">
<div class="elementor-element elementor-element-210b140 elementor-widget elementor-widget-shortcode" data-id="210b140" data-element_type="widget" data-settings="{"_animation_tablet":"none","_animation_mobile":"none","_animation":"none"}" data-widget_type="shortcode.default">
<div class="elementor-widget-container">
<div class="elementor-shortcode"><div role="form" class="wpcf7" id="wpcf7-f2619-p243-o1" lang="en-US" dir="ltr">
<div class="screen-reader-response"><p role="status" aria-live="polite" aria-atomic="true"></p> <ul></ul></div>
<form action="/#wpcf7-f2619-p243-o1" method="post" class="wpcf7-form init" novalidate="novalidate" data-status="init">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="2619">
<input type="hidden" name="_wpcf7_version" value="5.3">
<input type="hidden" name="_wpcf7_locale" value="en_US">
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f2619-p243-o1">
<input type="hidden" name="_wpcf7_container_post" value="243">
<input type="hidden" name="_wpcf7_posted_data_hash" value="">
</div>
<div class="form_home_1">
<label><br>
<span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Your Name*"></span> </label><br>
<label><br>
<span class="wpcf7-form-control-wrap your-email"><input type="email" name="your-email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" placeholder="Email*"></span> </label><br>
<label><br>
<span class="wpcf7-form-control-wrap your-phone"><input type="tel" name="your-phone" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-tel wpcf7-validates-as-required wpcf7-validates-as-tel" aria-required="true" aria-invalid="false" placeholder="Phone*"></span> </label><br>
<label><br>
<span class="wpcf7-form-control-wrap your-company"><input type="text" name="your-company" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Company Name*"></span> </label><br>
<label><br>
<span class="wpcf7-form-control-wrap your-website"><input type="url" name="your-website" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-url wpcf7-validates-as-url" aria-invalid="false" placeholder="Website URL"></span> </label><br>
<input type="submit" value="Submit Query" class="wpcf7-form-control wpcf7-submit submit"><span class="ajax-loader"></span>
</div>
<div class="wpcf7-response-output" aria-hidden="true"></div></form></div></div>
</div>
</div>
</div>
I need to change the styling of all the contact forms across the website (~6 of them).
The website I’m working on is using the ‘Coming soon’ mode. But here’s a link to the theme’s demo page if that helps.
Any and all help would be colossally helpful and much appreciated!
0
2 months
0 Answers
14 views
0
Leave an answer
You must login or register to add a new answer .