Hi there,
This is the live website : Please click the link here
If I put the color grey here =
.phpcontactform {background-color: grey;}
The color doesn’t only backgrounds the form, but the whole remaining HTML above. why is this sluggish behavior.
Obviously the term ‘sluggish behaviour’ means something different to you as there is no delay in the background propagating as it should 
The behaviour of that background is as expected when all the elements above it are floated. Floats are removed from the flow but they will repel foreground content but not backgrounds (or margins). The background of a non floated block element that follows a float will extend up to the containing block (which in your case is right at the top of the page).
Floats are special elements in that they are removed from the flow but with special properties that allow content to wrap around them. The background on your non floated element starts at the point as if your float was never there. This allows floats to float in and out of containers as required.
If you add clear:both to .phpcontactform then that element will clear the float and start after it.
The correct answer is that all your floats are incorrectly used and should be removed. Only use a float when you want content to wrap (in your example you avoid this by making the float 100% width which means you now have two wasted properties for every element that you floated).
These days you rarely need to use a float unless you want text to wrap around something like an image.
Remove the floats and start again
Sir,
Thank you so much for your help and valuable advise.
Can you also guide me how should I troubleshoot one more thing. On the same link i am using JS validation for form →
https://codepen.io/hmphry/pen/IFrva from the above code. It is working fine, but it doesn’t work for textarea and selections(<options>XXX</options>). Can you guide me what step should I take to troubleshoot this?
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.