Why is there so much space above my header image?

Hi, I just have one form. It has a header image. When I view it in a browser, there is all this space above the image. I can't seem to find any padding or spacing that should create that, or a field that is blank...can you tell me how to get my header up to the top of the window? The image does not have any white space above it either.

Thanks.

Aimee

Hey Aimee,

I have analyzed your custom injected CSS codes and I did some modifications. I have resolved the issue that you are currently experiencing with this form on desktops but I am not entirely sure if these modifications will affect the forms display on all mobile devices. I did some checks with my Galaxy Tab 3 and it is showing just fine but I am aware that these injected CSS codes were intentional installed to ensure that the form is properly viewed on all devices. 

Please take a look at my edition of your form: http://form.jotform.co/form/43628622344859?

Due to the extensive length of your injected CSS, I will just provide snippets for the styles that I have made adjustments to.

Original: @media screen and (max-width: 480px) {.jotform-form {padding: 10px 0;}}

Modified: @media screen and (max-width: 480px) {.jotform-form {padding: 0;}}

-----

Original: @media screen and (min-width: 480px) and (max-width: 768px) {.jotform-form {padding: 30px 0;}}

Modified: @media screen and (min-width: 480px) and (max-width: 768px) {.jotform-form {padding: 0;}}

-----

Original: @media screen and (min-width: 768px) and (max-width: 1024px) {.jotform-form {padding: 60px 0;}

Modified: @media screen and (min-width: 768px) and (max-width: 1024px) {.jotform-form {padding: 0;}

-----

Original: @media screen and (min-width: 1024px) {.jotform-form {padding: 90px 0;}}

Modified: @media screen and (min-width: 1024px) {.jotform-form {padding: 0;}}

----

Original: 

.form-line {margin-top: 12px; margin-bottom: 12px;} 

.form-line {padding: 12px 36px;}

Modified: 

.form-line {margin-top: 0; margin-bottom: 12px; padding-left: 36px} 

To make things a bit easier for you clone my edition of the form and continue making adjustments or, if you wish, you can simply copy my Inject Custom CSS codes into your edition of the form. I will await your response. I hope this fixes your issue.

Cheers!

seanmccthy

Hey Aimee,

Click Here for CSS Codes

I came up with a better solution for you as it relates to injecting my CSS codes into your version of the form. Please copy the code under the CSS tab in the table from the link above and paste it in the Custom Injected CSS section for your form. Instead of deleting the original codes, I simply use the comment code (/**/) for the browser to ignore it. The adjustments I made was clearly pointed out if you need to do additional tweaking.

Please let me know if this helps in any way. If you need further assistance please feel free to ask! :) 

Cheers!
seanmccthy

Hello Aimee

Please add this css code to your form:

@ seanmccthy
Thank you for the solution provided.