Textpattern CMS

#1 2008-03-27 16:51:27

roelof

Member

Registered: 2005-03-27

Posts: 647

zem-contact reborn ie7 display problem

Hello,

I use this plugin for a contact form with the rule <txp:zem_contact to="email address" break="<br />" />

and i use this css :

input,
textarea,
select {
	padding: 2px;
	font: 400 1em verdana, sans-serif;
	color: #444;
	background-color: #EEEEEE;
	border: 1px solid #444444;
}

input:focus,
input:hover,
textarea:focus,
textarea:hover,
select:focus,
select:hover {
	color: #000000;
	background-color: #E4F7FA;
	border: 1px solid #00DFFF;
}

input.button {
	padding: 2px 5px 2px 5px;
	font: 400 1.1em "trebuchet ms", serif;
	color: #555555;
	background-color: #9FF3FF;
	border-width: 1px;
	border-style: solid;
	border-color: #FFF #00DFFF #00DFFF #FFF;
}

#txpCommentInputForm {
	margin-top: 20px;
}

#txpCommentInputForm p {
	text-transform: none;
	text-align: left;
}

#txpCommentInputForm label {
	text-transform: capitalize;
	padding-left: 5px;
}

#txpCommentInputForm input.checkbox {
	width: 13px;
}

p#txpCommentInputForm,
p.closed {
	color: #9FF3FF;
	text-align: center;
	text-transform: uppercase;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 4px 0px 3px 7px;
}

#txpCommentInputForm input {
	width: 250px;
}

#txpCommentInputForm input.button {
	width: 80px;
}

#txpCommentInputForm textarea {
	width: 350px;
	height: 200px;
}

.zemContactForm {
	padding-left: 15px;
}

legend {
	display: none;
}

fieldset {
	border: 0;
}

ol.comments {
	list-style: none;
	margin: 0;
	padding: 0;
}

ol.comments li .reply {
	color: #FFFFFF;
	margin: 10px 15px 10px 15px;
	padding: 10px;
	display: block;
	background: #444444;
	border: 1px solid #9FF3FF;
}

but now the labels are on the left side and the input field on the right side.
How can i change this so everything is on the left side.

Roelof

Last edited by roelof (2008-03-27 20:46:30)

#2 2008-03-27 17:51:07

ruud

Developer Emeritus

From: a galaxy far far away

Registered: 2006-06-04

Posts: 5,068

Website

Re: zem-contact reborn ie7 display problem

This is not correct: <txp:zem_contact to="email address" break="<br />" />

zem_contact doesn’t have a break attribute, the tags that create the actual input fields do have that attribute, but it’s set to <br /> by default, so there’s no need to specify it.
To remove the legend/fieldset, set the label attribute to an empty string instead of overriding in CSS:

<txp:zem_contact to="email address" label="" />

As for the rest of the styling… can you provide an example URL that demonstrates the problem. It’s often much easier to solve such problems when seeing the actual website.

Last edited by ruud (2008-03-27 17:51:31)

#3 2008-03-27 18:20:08

roelof

Member

Registered: 2005-03-27

Posts: 647

Re: zem-contact reborn ie7 display problem

hello Ruud,

The contact fom can be found at : http://textpattern.tamarawobben.nl/?s=contact.

Roelof

#4 2008-03-27 18:30:24

ruud

Developer Emeritus

From: a galaxy far far away

Registered: 2006-06-04

Posts: 5,068

Website

Re: zem-contact reborn ie7 display problem

but now the labels are on the left side and the input field on the right side.
How can i change this so everything is on the left side.

I’m looking at your website in Firefox. Both labels and input fields are on the left side:

Naam
[__________]
Email
[__________]
etc.

#5 2008-03-27 18:36:40

roelof

Member

Registered: 2005-03-27

Posts: 647

Re: zem-contact reborn ie7 display problem

hello Ruud,

Chips, then it must be a ie7 problem.
I work with ie7 and there it isn’t right.

Roelof