StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POSolution for fixed & hidden div bug on Google Chrome
primarykey
Id
9702391
data
AcceptedAnswerId
0
AnswerCount
1
ClosedDate
CommentCount
4
CommunityOwnedDate
CreationDate
2012-03-14T12:55:54.493
FavoriteCount
1
LastActivityDate
2013-05-02T12:34:59.683
LastEditDate
2017-05-23T12:04:28.950
LastEditorUserId
-1
OwnerUserId
920173
ParentId
0
PostTypeId
1
Score
2
ViewCount
2277
LastEditorDisplayName
text
Body
Problem: A div with <code>visibility:visible</code> inside a parent div with <code>position:fixed</code> and <code>visibility:hidden</code> causes rendering problems in Google Chrome. <a href="https://stackoverflow.com/questions/8568673/is-there-a-bug-in-chromes-css-visibility-rendering">Images and examples can be found here</a>. A week ago you could just add the <code>-webkit-transform:translateZ(0)</code> to the parent div and bug solved. But it isn't working anymore: <ul> <li><a href="http://jsfiddle.net/bHzWN/show/" rel="nofollow noreferrer">Without <code>-webkit-transform</code></a></li> <li><a href="http://jsfiddle.net/kizu/bHzWN/6/show/" rel="nofollow noreferrer">With the hack</a>.</li> </ul> Both are bugged. So, is there any solution? When you resize the window, it repaints the divs, also when you open the developer tools the bug disappears. So I've been trying to force a repaint with javascript (jQuery): <pre><code>jQuery(window).scroll( function() { jQuery("#parentDiv").addClass("nothing"); jQuery("#parentDiv").removeClass("nothing"); }); </code></pre> And it sometimes works (when a textfield is displayed inside the inner div). Really weird. Also tried hiding and displaying the div, adding css properties (fixed, bottom:0...) But nothing works fine. Any ideas? EDIT2: Seems like it only happens to me: 2 friends, using windows and the latest version (17.0.963.79) don't see the bug in the second link. But I still see it. I've reinstalled chrome under windows, and the bug is still there. I also have cleared the cache, but nothing changes. Am I the only one????
Tags
<javascript><css><google-chrome>
Title
Solution for fixed & hidden div bug on Google Chrome
singulars
PostAcceptedAnswerId
1. This table or related slice is empty.
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USCommunity
UserOwnerUserId
1. USSalvatorelab
plurals
PostLinksPostIdRelatedPostId
1. PL
 singulars
 LinkTypeLinkTypeId
 LTLinked
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
VotesPostIdCreationDate
1. VO
 singulars
 PostPostId
 POSolution for fixed & hidden div bug on Google Chrome
 UserUserId
 USSalvatorelab
 VoteTypeVoteTypeId
 VTFavorite
2. VO
 singulars
 PostPostId
 POSolution for fixed & hidden div bug on Google Chrome
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
3. VO
 singulars
 PostPostId
 POSolution for fixed & hidden div bug on Google Chrome
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTApproveEditSuggestion
CommentsPostId

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.