Lightwave comments on New 'landing page' website: Friendly-AI.com - Less Wrong

11 Post author: lukeprog 12 December 2011 09:45AM

You are viewing a comment permalink. View the original post to see all comments and the full post content.

Comments (40)

You are viewing a single comment's thread. Show more comments above.

Comment author: [deleted] 12 December 2011 10:50:54PM *  5 points [-]

on linux, latest version as of a few days ago. May be my fonts?

That sort of thing happens when the element that is colored isn't constrained to the text element. Somewhere in there is an assumption about font size or dpi or something which is bound to be broken by some clients.

EDIT: it's not my fault. Here's your problem:

#link_boxes {
margin: 30px -40px -15px -40px;
padding: 0 40px;
height: 180px;
background: #f6f6f6;
}

the height: 180px is the problem assumption. I think If you just removed it, it should work in all cases. If I figure out how to make opera hack css teh way it can hack the html, I'll test it.

EDIT2: that doesn't fix it, also have to change this part:

#link_boxes a.box, #link_boxes a.box:link {
width: 160px;
height: 150px;
float: left;
display: block;
background: #f6f6f6;
border: none;
text-align: center;
padding: 15px 11px;
}

pixel measurements all over the place. I hate web designers.

EDIT3: for a quick hack that should make it a bit more flexible, replace px measurements with something approximately the same in em measurements. I think em is properly tied to dpi and font size.

EDIT4: FAQ page is broken too. The 'Questions' part of the 'frequently asked questions' header word-wraps onto the table of contents. interestingly, it doesn't when I give the browser less room. The font size increments when I give it enough room to draw those damn margins, but again, the assumptions of DPI and font size don't let it fit properly. In this case the whole fixed content width idea should be thrown out. Let it fill the window. The whole point of HTML is that it reflows with different browser windows. At least there's no horizontal scroll.

I'll stop trying to break the site now. Sorry about all the hate.

Comment author: anonym 13 December 2011 04:54:24PM 0 points [-]

I also see the FAQ page as broken with 'Questions' in the header appearing overlayed on the #2 and #3 items in the 'contents' list. With Firefox 8 on Linux at default zoom, and zooming down to make the fonts smaller than normal does fix it.

I agree with nyan_sandwich that things would be much improved if the CSS used ems instead of pixels, which are guaranteed to break if users have non-standard fonts or font sizes or their browser happens to have different enough default CSS rules.

Comment author: Lightwave 17 December 2011 08:04:52AM 0 points [-]

How is it for you now? If you have any problems, can you please make a screenshot (and upload to http://imgur.com or somewhere else) to help us diagnose the problem?

Comment author: anonym 17 December 2011 08:12:28PM -1 points [-]

It's much better now. The only issue remaining is that the 'Frequently Asked Questions" is just a tiny bit too wide to fit on one line inside the containing box, so the 'ns' of 'Questions' sticks outside of the gray box it is supposed to be inside.