CODEWITHSUNDEEP
htmlcsstumblr
Tiana987642
Tiana987642

Reputation: 754

Theme doesn't display image correctly on the first load

The problem is still unsolved and I don't know why . However ; change another theme can fix it . .......................................

I have a problem about the theme of tumblr . It hasn't been "working" since the first time . It doesn't mean it don't work . It only works after I refresh the page .

The first time I load the page ; most of the elements (images) of the content are un-styled ; they overlaps each others and that's annoying

Here is the theme

http://tinypaste.com/fa31b3

If I'm not wrong ; this's responsible for the images .

 .entry img { 
{block:IndexPage}
width: {block:IfNot2Columns}240px{/block:IfNot2Columns}{block:If2Columns}500px{/block:If2Columns}; 
{/block:IndexPage}
{block:PermalinkPage}
width:500px;
{/block:PermalinkPage}
}

Can you guys help me out . Any ideas will be appreciated

Upvotes: 1

Views: 1051

Answers (2)

Vladimir Starkov
Vladimir Starkov

Reputation: 19803

The reason is that browsers caches you styles with previous styles for images, and because of it browsers have no actual rules(have only previuos styles) for your images.

I have more readable and flexible solution for you, which will work without exceptions:

Tumblr markup:

<body class="
{block:IndexPage}
    index-page
    {block:IfNot2Columns}not-twocolumns{/block:IfNot2Columns}
    {block:If2Columns}twocolumns{/block:If2Columns}
{/block:IndexPage}
{block:PermalinkPage} permalink-page{/block:PermalinkPage}
">

CSS:

.index-page.not-twocolumns .entry img {
    width: 240px;
}

.index-page.twocolumns .entry img {
    width: 500px;
}

.permalink-page .entry img {
    width: 500px;
}

Upvotes: 1

superdemongob
superdemongob

Reputation: 258

have you waited long enough for the content on the page to load?

when i use facebook on my outdated laptop, the same thing happens to me but it fixes itself in about 30-40 seconds once everything is loaded.

Upvotes: 0

Related Questions