Share This

Tabeli w stronach responsywnych staram się unikać, chociaż czasem pojawiają się sytuacje kiedy ich użycie ułatwia formatowanie pewnych elementów strony.

1. Składając ostatnio stronę www miałem ustawić cztery dość duże ikony obok siebie. Najprostsze wyjście to umieścić je w czterech oddzielnych pozycjach modułów, lub w module który ma możliwość ustawienia elementów w 4 kolumnach. Jednak na smartfonie te elementy ustawiłyby się jeden pod drugim i dodatkowo powiększyły. Mi zależało na układzie poziomym w każdej rozdzielczości, także na małych ekranach smartfonów i tabletów. Ważne było więc bezproblemowe skalowanie grafik.

Strony www Lublin na Joomla

 

2. Postanowiłem posłużyć się tabelą której szerokość ustawiłem na 100%.  Widoczny efekt był zadowalający a skalowanie strony www lublin we wszystkich przeglądarkach przebiegało bez problemu. We wszystkich oprócz Internet Explorera.

Strony www Lublin na Joomla

 

3. Jak widać to co nie stanowi problemu w Firefoxie, Operze czy Google Chrome w Internet Explorerze jest interpretowane nie tak jak chciałem. Rozwiązanie było banalne, ale jego znalezienie trochę mi zajęło. Nie znalazłem odpowiedzi na żadnej stronie polskojęzycznej. Dowiedziałem się za to że Internet Explorer w wielu przypadkach potrafi interpretować kod całkiem po swojemu.

Strony www Lublin na Joomla

 

 4. Ustawienie w tabeli wartości 100% szerokości jest wystarczającą informacją dla większości przeglądarek. Dla Internet Explorera musimy zadbać o jeszcze jedno. Wielkość grafik znajdujących się w tabeli naszej strony www Puławy nie może być ustawiona w pikselach, lub nie mogą być puste pola dotyczące wielości grafik. Żeby wszystko skalowało się tak jak należy ustawiamy szerokość każdej grafiki w tabeli na "100%" a wysokość na "auto" 

Jak widać edytor Tiny MCE także nie radzi sobie ze skalowanie tabeli jeśli zawiera ona większe grafiki.

Strony www Lublin na Joomla

 

5. Po akceptacji ustawień w edytorze Tiny MCE tabela z grafikami mieści się już w polu edycji. Problem ze skalowaniem strony internetowej w Internet Explorer także został rozwiązany. Trzeba jednak pamiętać że ustawienie szerokości grafik na 100% może spowodować ich powiększenie ponad rozmiar rzeczywisty a tym samym mogą one się wydawać słabej jakości.

Na przykład strona internetowa Lublin ma na dużym monitorze szerokość 1200 px. Tabela jeśli ma układ 4 kolumnowy będzie mogła mieścić 4 grafiki o szerokości 300px każda. Jeśli wstawimy w tabelę grafiki o rzeczywistej szerokości 200px to po nadaniu im szerokości 100%  przeskalują się one do szerokości 300px. Na większym ekranie będzie więc widoczny spadek ich jakości. 

 

Strony www Lublin na Joomla

 

Przydało się? - Udostępnij

Blog - popularne

Specified key was too long; max key length is 767 bytes - błąd podczas przywracania strony za...

Klient poprosił mnie o zwiększenie wersji PHP do najnowszej wersj PHP 7.2. Przy stronach firmowych najczęściej nie wykonuję takich operacji z automatu tylko staram się na początek sprawdzić czy jest...
Czytaj dalej

Akeeba Kickstart - czyli jak przywrócić stronę internetową Joomla 3 z kopii zapasowej Akeeba Backup

Przenosimy stronę na CMS joomla na inny serwer. Mając wykonaną za pomocą Akeeba Backup kopię strony www możemy ją przenieść w krótkim czasie na dowolny serwer. Czas wysyłania na serwer rozpakowanych...
Czytaj dalej

Jak zrobić banner slideshow w joomla 3 - dodatek Roksprocket dla strony www na joomla

Roksprocket dla Joomla czyli jak zrobić banner dla naszej strony internetowej na joomla. Roksprocket do moduł którego wersja występuje także dla wordpressa. Można za jego pomocą wykonać nie tylko...
Czytaj dalej

Jak dodać firmę do Google Maps

Tworząc firmową stronę internetową prawie zawsze umieszczamy na niej mapę z lokalizacją firmy. Czasy statycznych map graficznych minęły dawno temu. Teraz najczęściej szukamy firm na google które ma...
Czytaj dalej

Jak dodać film z youtube stronę www na joomla - dodatek AllVideos od Joomla Works

Niezbyt często korzystam w wykonywanych stronach www z możliwości osadzania w nich wideo. Jeśli klienci mają przygotowane materiały wideo warto je wykorzystać nie tylko z powodu lepszego zapoznania...
Czytaj dalej

Jak wykonać przekierowanie DNS domeny zarejestrowanej na home.pl na serwer nazwa.pl - na którym...

Przekierowanie DNS wykonujemy kiedy domenę zarejestrowaliśmy w jednej firmie, a hosting dla naszej strony internetowej wykupiliśmy w innej. Dzisiaj pokażę jak przekierować domenę zarejestrowaną na...
Czytaj dalej

Przezroczystość w plikach PNG - jak zapisać plik z PNG z przezroczystością w Adobe Photoshop dla...

Format .png to drugi w kolejności po .jpg format plików graficznych wykorzystywany w czasie tworzenia stron internetowych. Oczywiście większość użytkowników internetu najbardziej kojarzy .jpg bo w...
Czytaj dalej

WordPress - jak wykonać kopię zapasową strony www na WordPress za pomocą Akeeba Backup

WordPress podobno nie sprawia problemów, ale dmuchając na zimne - kopię strony www należy wykonać jeśli zależy nam na bezpieczeństwie naszych danych. Akeeba Backup to narzędzie które powstało jako...
Czytaj dalej

Akeeba Backup - jak wykonać kopię strony www na CMS Joomla 3

Akeeba Backup pozwala na tworzenie kopii na wszystkich wersjach joomla - tu w wersji dla Joomla 3 Mając stronę internetową utrzymywaną na dobrym hostingu nie musimy martwić się o wykonywanie kopii...
Czytaj dalej