Każda ilustracja wstawiona do tekstu ,,z automatu'' wyświetla się w osobnym akapicie. Warto tu wspomnieć, że zawsze wyświetlana jest responsywnie to znaczy, że dostosowuje się do wielkości urządzenia na jakim jest oglądana.
Jeśli jednak chcemy, aby ilustracja była oblewana tekstem z prawej lub lewej strony (co jest atrakcyjną opcją ilustrowania publikacji) to efekt taki możemy łatwo uzyskać w formularzu parametrów załączonej ilustracji.
Formularz jest dostępny pod prawym klawiszem myszki, jeśli klikniemy w edytorze na ilustrację zaznaczając ją jakom blok:
W formularzu tym w zakładce zaawansowane możemy zmienić pozycjonowanie ilustracji w stosunku do tekstu: zaznaczy c, że tekst ma oblewać ilustrację z prawej lub lewej strony.
Ważnym jest również, aby zadbać o to aby tekst nie przylegał ,,na styk'' do ilustracji i między ilustracją a tekstem był zachowany odpowiedni margines.
Dlatego powinniśmy w formularzu zdefiniować margines poziomy (używamy najczęściej wartości 10) a w polu styl dopisać instrukcję CSS w postaci:
- float: left;
jeśli chcemy aby ilustracja była równana do lewego marginesu i z prawej strony oblana tekstem. - float: right;
gdy chcemy ilustrację równać do prawego marginesu.
Być może to jest utrudnienie, że trzeba wpisywać kod w języku CSS, który odpowiada za sposób wyświetlania danych w serwisach internetowych. Udostępnienie jednak pola do edycji CSS ilustracji zamiast pola wyboru: równaj do prawej, równaj do lewej umożliwia wiele innych opcji zmiany CSS dla tego elementu.
NO CÓŻ: tak to działa i warto na marginesie tego wiedzieć, że współcześnie serwisy internetowe są definiowane w 3 językach programowania: HTML5 (treść), CSS (sposób wyświetlania) oraz JS (definiowanie interakcji) a przestarzałe programy nauczania informatyki w szkole zwyczajnie kłamią ucząc HTML po staremu.