Home/ Questions/Q 7637741
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T08:00:51+00:00

EDIT: Sorry Guys, This has been resolved The comment to check the inline style

  • 0

EDIT: Sorry Guys, This has been resolved The comment to check the inline style has fixed the issue. The problem wasn’t actually in the css, but in the javascript. Sometimes, when you code for too long you tend to miss these things. Still, thanks for the help

I having a bug with my css. When I disable caching in firefox, the width of an aboslute positioned container div doesn’t stretch to fit the child div. When I reload the page (image has been cached in the browser), it exectures properly. Centering is done by a javascript(works great, but it doesnt center when the image is cached, because the width of the parent(lbCenter)=0).

<div id="lbOverlay" style="background: url("blue.png") repeat scroll 0% 0% transparent; opacity: 0.25;"></div>
<div id="lbCenter" style="display: block; padding: 0px; left: 675px; top: 305px; width: 0px; height: 0px; margin-left: 0px;">
<div class="lbcb"></div>
<div id="lbWrap">
<img src="http://www.emohaircuts.org/wp-content/uploads/2010/08/emo-boy-fashion.jpg">
</div>
</div>

CSS:

#lbOverlay {
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;    
    height: 100%;
}
#lbCenter {
    overflow:visible;
    display:block;
    text-align:center;
    position: absolute;
/*  padding: 20px;*/
    z-index: 110111111;
    outline: none;
}
/**------*/
#lbCenter{
color:green;
border: 10px solid #CCCCCC;
}

How can I achieve that when the content of lbWrap changes, the parents width get automatically updated? For example when the image has been fully loaded/

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I believe that if you specify width and height, then your problem might be solved. Even if it wouldn’t it is always good practice to include these values, because browser will know how much space it should reserve for the image (that is why I think it could help). Also, it is a good practice to include alt attribute (for search engines or in case the image cannot be displayed)

    <img src="http://www.emohaircuts.org/wp-content/uploads/2010/08/emo-boy-fashion.jpg" height="351" width="263" alt="Emo boy">
    • 0