What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 122 Stack Exchange communities.

Here is an example (2 image / 2 kbd):

Here is another example (2 images / 1 kbd):

Here is yet another example (A lot of stars in a kbd):

**********************************************************************************************************************************************************************************

share|improve this question
8  
Woah... +1 for totally breaking the site. Looks like we need an overflow: hidden; somewhere. –  uɐɯsO uɐɥʇɐN Feb 14 '12 at 2:37
1  
The images behave fine on the mobile site but the *** do not –  Resorath Feb 14 '12 at 2:40
2  
This isn't new –  Alex Coplan Feb 14 '12 at 2:40
    
@AlexCoplan: It's actually older than that, but somehow decided to remove my questions on this bug. The same happens with a lot of ` > ` characters on one line... :) –  Tom Wijsman Feb 14 '12 at 2:48
add comment

2 Answers

Okay, I have researched a possible solution using CSS:

.post-text p {
    overflow: hidden;
}

That completely solves this issue (and any other "it overflows the post" problems).

share|improve this answer
2  
type $('.post-text p').css({overflow:'hidden'}); in console to test :) –  Alex Coplan Feb 14 '12 at 2:46
    
Or javascript:$('.post-text p').css({overflow:'hidden'}); in the address bar. :) –  Tom Wijsman Feb 14 '12 at 2:50
7  
@GeorgeEdison: What about the >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> bug in comments/posts? –  Tom Wijsman Feb 14 '12 at 2:52
    
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>‌​>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Whats the bug exactly (in comments)? –  AsheeshR Sep 21 '13 at 7:08
add comment

Here’s a better solution:

pre, code, kbd, var, samp {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

It will make code spans and similar elements automatically wrap to the next line when needed, in all browsers.

Here’s a jsFiddle demonstrating this snippet for an inline <code> span: http://jsfiddle.net/VT6Uu/

This should also fix the >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> problem in comments.

Yo dawg, here are some quotes within quotes:

test

This can be fixed by setting the blockquote padding to zero when it’s wrapped in too many blockquote elements:

blockquote blockquote blockquote blockquote {
  padding: 0;
}

In this case, you would be able to visually nest up to three quotes.

To quickly test the above snippets on this page, enter this in your console:

$('<style>pre,code,kbd,var,samp{white-space:pre;white-space:pre-wrap;word-wrap:break-word}blockquote blockquote blockquote blockquote{padding:0}</style>').appendTo('head');
share|improve this answer
    
+1 But doesn't work for comments. Also doesn't work many nested quotes in a post. Perhaps you need to add a selector for the comment and for the blockquote? –  Tom Wijsman Apr 23 '12 at 9:20
    
@TomWijsman Added a fix for the nested quotes problem. –  Mathias Bynens Apr 23 '12 at 9:44
1  
@MathiasBynens For comments, you can apply word-wrap to the <div> wrapping the comment. See my suggestion here: meta.stackoverflow.com/a/131533/172108 –  iglvzx May 5 '12 at 22:44
add comment

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .