The murmur of the snarkmatrix…

August § The Common Test / 2016-02-16 21:04:46
Robin § Unforgotten / 2016-01-08 21:19:16
MsFitNZ § Towards A Theory of Secondary Literacy / 2015-11-03 21:23:21
Jon Schultz § Bless the toolmakers / 2015-05-04 18:39:56
Jon Schultz § Bless the toolmakers / 2015-05-04 16:32:50
Matt § A leaky rocketship / 2014-11-05 01:49:12
Greg Linch § A leaky rocketship / 2014-11-04 18:05:52
Robin § A leaky rocketship / 2014-11-04 05:11:02
P. Renaud § A leaky rocketship / 2014-11-04 04:13:09
Bob Stepno § The structure of journalism today / 2014-03-10 18:42:32

CSS tech support

Psst. A little CSS help? If anybody can tell me why the top line, with the email form, is breaking in IE7… I will immortalize your name forever in the HTML source. <!-- Seriously. -->


I believe .signupform-extra needs an explicit height or at least an explicit line-height, to match the form. Try giving it a height and a line-height of 45px.

Err, didn’t realize that div was set to inline. Browser’s never agree on line-heights, and IE is especially fickle with block-level elements being set to inline. Floating is easier in this case. Replace

.signupform-extra {
display: inline;

form#mc-embedded-subscribe-form {
display: inline;


.signupform-extra {
float: left;
line-height: 47px;
.signup form input {
float: left;

You can see it working here:

And here it is in IE7:

Nooo! An unnecessary apostrophe slipped into that last comment!


Thank you. I really appreciate it.

Damn, Robin, I forgot you also have a separate blog. Nice design!

The snarkmatrix awaits you

Below, you can use basic HTML tags and/or Markdown syntax.