2013-03-21 38 views
6

Stworzyłem mały widżet wyszukiwania, jednak tło nie pojawia się podczas przeglądania go przez chrome. Przetestowałem IE, FF i safari, które wyglądają dobrze.Obraz tła nie wyświetlany w przeglądarce Chrome

http://paradigmsearch.co.uk/widget/?id=1

Jestem zazwyczaj niechętnie umieścić kwestię układu na SO. Jednak przez jakiś czas się nad tym zastanawiałem.

na elemencie:

<div class="widget" id="id_300x250"> 

Ja stosując następujące definicje CSS

.widget { 
    font-family: arial; 
    height: 250px; 
    width: 300px; 
    border: none; 
    background: url('/uploads/widget_background/cached/proportional/300x250/1_512648b566578.png') no-repeat center center; 
} 

W tle po prostu nie jest widoczny. Jeśli jest to naprawdę głupie nadzór marży/css, to przepraszam bardzo.

Obecnie za pomocą przeglądarki Chrome w wersji 25.0.1364.172m

+0

Widzę to w porządku, sama wersja Chrome, ekspres do okna. – Rchristiani

+0

Widzę dobrze tło. Jestem też w chromie 25.0.1364.172 m. O ile wiem, twój kod jest w porządku. – madaaah

Odpowiedz

13

Jest to dość zabawne problem, który ja tylko zorientowali się podczas otwierania strony w trybie incognito Chrome: Twój obraz tła jest blokowany przez AdBlock.

Również w przypadku renderowania lepiej jest przyklejać elementy style na stronie użytkownika head.

+0

Ah shoot! tak, mam blok reklam, ale nie na długo. Dzięki. –

+0

Byłbym bardziej zainteresowany tym, dlaczego został wykryty jako reklama. Obrazy w Twojej witrynie ładują się dobrze, w przeciwnym razie możesz przenieść je do innego folderu. :-) –

+0

Tak, ma to związek z nazwą używanego identyfikatora. 300 x 250 to standardowy wymiar jednostki reklamowej, więc dobrze byłoby NIE używać go. Dzięki. –

0

Przetestowałem twój kod za pomocą chrome 25.0.1364.172m, wszystkie wyglądają OK.

Sprawdź to: http://jsfiddle.net/rcHMc/

HTML

<div class="widget" id="id_300x250"> 

CSS

.widget { 
    font-family: arial; 
    height: 250px; 
    width: 300px; 
    border: none; 
    background: url('http://paradigmsearch.co.uk/uploads/widget_background/cached/proportional/300x250/1_512648b566578.png') no-repeat center center; 
} 
Powiązane problemy