Click here to Skip to main content
15,795,712 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I am simply trying to place a 16x16 calendar icon to the right of this text box. It was working fine, then I purchased a template and after applying the template, the image started appearing below the text box and is stretching the length of the div.

.contact-form {
position: relative;
vertical-align: top;
z-index: 1;
margin: 0;
top: -10px;
.contact-form .txt-form {
display: none;
.contact-form .coll-1, .contact-form .coll-2, .contact-form .coll-3 {
margin-bottom: 23px;
float: left;
width: 200px;
.contact-form .coll-1 p, .contact-form .coll-2 p, .contact-form .coll-3 p {
margin-bottom: 3px;
.contact-form .coll-1, .contact-form .coll-2 {
margin-right: 10px;
.contact-form fieldset {
top: 9px;
border: none;
padding: 0;
width: 100%;
position: relative;
z-index: 10;
.contact-form label {
display: block;
min-height: 45px;
position: relative;
margin: 0;
padding: 0;
float: left;
width: 100%;

Due Date*

What I have tried:

I've tried float and various display options on the image.
Updated 19-Oct-17 9:33am

1 solution

In your CSS, change the property of Position to static in the css class like this:

position: static

this will not allow the image to stretch. For further more information about position you can visit this link
CSS Layout - The position Property[^]
Share this answer
ftbadolato76 19-Oct-17 11:10am    
There are a number of instances of "position: relative;". Which are you suggesting I change? Also, will this not have potential adverse affects to other uses of this CSS throughout the site? Is there any solution where I can apply CSS directly to this image? I'd hate to screw things up for other pages as this is the only case where I need to stick that image to the right of the text box.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900