The murmur of the snarkmatrix…

snarl § Two songs from The Muppet Movie / 2021-02-16 18:31:36
Robert § Two songs from The Muppet Movie / 2021-02-14 03:26:25
Bob § Two songs from The Muppet Movie / 2021-02-13 02:23:25
Sounds like § Two songs from The Muppet Movie / 2021-02-12 17:11:20
Ryan Lower § Two songs from The Muppet Movie / 2021-02-12 16:15:35
Jennifer § Two songs from The Muppet Movie / 2021-02-12 15:53:34
A few notes on daily blogging § Stock and flow / 2017-11-20 19:52:47
El Stock y Flujo de nuestro negocio. – redmasiva § Stock and flow / 2017-03-27 17:35:13
Meet the Attendees – edcampoc § The new utility belt / 2017-02-27 10:18:33
Meet the Attendees – edcampoc § The generative web event / 2017-02-27 10:18:17

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. -->

5 comments

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;
}

with

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

You can see it working here:
http://clients.sleepoversf.com/robinsloan/

And here it is in IE7:
http://clients.sleepoversf.com/robinsloan/ie7.png

Nooo! An unnecessary apostrophe slipped into that last comment!

P-E-R-F-E-C-T.

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.