This is an archive of an inactive wiki and cannot be modified.

AvoidWideElements

Since the primary scrolling direction on mobile devices is vertical, this technique concerns avoiding "wide" elements -- elements whose horizontal dimension is large, and which may require "secondary scrolling" in the horizontal direction to view.

Implementation Steps:

<table>
<tr><td>Do</td><td>A deer, a female deer</td></tr>
<tr><td>Re</td><Td>A drop of golden sun</td></tr>
<tr><td>Mi</td><td>A name I call myself</td></tr>
...
</table>

<ul>
<li>Do: A deer, a female deer</li>
<li>Re: A drop of golden sun</li>
<li>Mi: A name I call myself</li>
...
</ul>

<img src="..." height="80" width="120"/>

<img src="..." width="100%"/>
...
<p style="width: 100%">...</p>

Back to BestPracticesList


CategoryPhp CategoryXhtml CategoryBpScrollingOneDir CategoryBpLargeGraphics CategoryBpTablesAlternatives CategoryBpImagesResizing

Contributions to this wiki are governed by the W3C policies for Contribution to W3C' wiki on Mobile Web.