Obraz na stronie ma ustawione w CSS opływanie tekstem zapisem float: right;, a tekst przylega do obrazu. Aby tekst był oddalony od obrazu o 10 pikseli, w stylu obrazu należy dodać zapis
A. border-left: 10px;
B. clear: left;
C. margin-right: 10px;
D. margin-left: 10px;
Poprawny zapis to margin-left: 10px;. Obraz z ustawieniem float: right; jest dosuwany do prawej strony, a tekst opływa go od lewej. Skoro tekst znajduje się po lewej stronie obrazu, odstęp między tekstem a obrazem trzeba utworzyć po lewej stronie samego obrazu. Służy do tego margines zewnętrzny margin-left. Reguła do zapamiętania: margines dodaje się po tej stronie elementu, od której ma powstać wolna przestrzeń. W praktyce taki zapis stosuje się często przy miniaturach, zdjęciach w artykułach lub ikonach opływanych tekstem. Typowa pułapka polega na wyborze margin-right: 10px;, które przy float: right; zwiększa odstęp po prawej stronie obrazu, a nie między obrazem i tekstem.
Przy obrazie ustawionym jako float: right; tekst opływa element od lewej strony, więc odstęp między tekstem a obrazem należy dodać po lewej stronie obrazu. Poprawny zapis to margin-left: 10px;. Deklaracja margin-right: 10px; tworzy margines po prawej stronie obrazu, czyli zwykle przy krawędzi kontenera, a nie tam, gdzie przylega tekst. Zapis border-left: 10px; dotyczy obramowania po lewej stronie elementu, a nie odstępu zewnętrznego; dodatkowo samo podanie szerokości obramowania nie jest typowym sposobem odsuwania tekstu od obrazu. Właściwość clear: left; służy do przerywania opływania przy elementach pływających po lewej stronie, a nie do ustawiania odległości między tekstem i obrazem. Typowy błąd polega na myleniu strony, po której znajduje się element po zastosowaniu float, ze stroną, po której trzeba dodać margines. Dla obrazu po prawej odstęp od tekstu powstaje przez lewy margines obrazu.