Hi All,
I looking for a little assistance on customizing the look of a Marketo form we have hosted on a Marketo landing page --> N3 - Sales Specialization
I would like the asterisk to be positioned to the left of the input fields, however, it keeps moving above. I have selected "left" in the form settings under "label position" and that didn't seem to fix it. I am sure it is a CSS issue, but I have been working on it now for too long and decided to reach out to the community for help!
Let me know if anyone has ideas! Thanks,
- Jeff
It looks like you're stretching the label (which the asterisk lives in) and the input fields both to a width of 100% for that form container. Because of this, you can't fit 2 elements in the same row next to each other if they both stretch 100% of the width.
You should change the following class to a width of 10% instead of 100%:
.mktoForm .mktoLabel
Then, you should change the following class to a width of say 90% instead of 100%:
.mktoForm input[type=text],
.mktoForm input[type=url],
.mktoForm input[type=email],
.mktoForm input[type=tel],
.mktoForm input[type=number],
.mktoForm input[type=date],
.mktoForm select,
.mktoForm textarea
That should do the trick.
That was it. Thanks Jim!