cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Surveyor

Why are my buttons different sizes?

Every time I open my Canvas page my buttons are different sizes.  I'd love for the button on the left to be larger than the others, but not if it means the other buttons change sizes every time I open the page! 

Look:

IMG_4861 2.PNGIMG_4862 2.PNGIMG_4864 2.PNG

 

Here's my code: 

</tr>
<tr style="height: 26px;">
<td style="height: 26px; width: 864.444px;" colspan="7"><img src="https://wwu.instructure.com/courses/1412042/files/67760929/preview" alt="Screen Shot 2020-09-14 at 11.27.04 AM.png" width="800" height="36" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67760929" data-api-returntype="File" /></td>
</tr>
<tr style="height: 20px;">
<td style="height: 150px; width: 150px; text-align: right; vertical-align: middle;" rowspan="3"><a href="https://wwu.instructure.com/courses/1412042/modules" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/modules" data-api-returntype="[Module]"><img src="https://wwu.instructure.com/courses/1412042/files/67756221/preview" alt="Modules.png" width="140" height="140" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67756221" data-api-returntype="File" /></a></td>
<td style="text-align: center; vertical-align: middle; height: 10px; width: 100px;"></td>
<td style="width: 100px; height: 10px; text-align: center; vertical-align: middle;"></td>
<td style="width: 100px; height: 10px; text-align: center; vertical-align: middle;"></td>
<td style="width: 100px; height: 10px;"></td>
<td style="width: 100px; height: 10px;"></td>
<td style="width: 100px; height: 10px;"></td>
</tr>
<tr style="height: 90px; text-align: left;">
<td style="vertical-align: middle; height: 95px;"><a href="https://wwu.instructure.com/courses/1412042/pages/syllabus" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/pages/syllabus" data-api-returntype="Page"><img src="https://wwu.instructure.com/courses/1412042/files/67754356/preview" alt="Syllabus.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67754356" data-api-returntype="File" /></a></td>
<td style="vertical-align: middle; height: 95px;"><a href="https://piazza.com/class/kf2pf9kvmlewk?"><img src="https://wwu.instructure.com/courses/1412042/files/67754355/preview" alt="Piazza.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67754355" data-api-returntype="File" /></a></td>
<td style="vertical-align: middle; height: 95px;"><a href="https://wwu.instructure.com/courses/1412042/pages/24-slash-7-zoom-room" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/pages/24-slash-7-zoom-room" data-api-returntype="Page"><img src="https://wwu.instructure.com/courses/1412042/files/67754450/preview" alt="247zoom.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67754450" data-api-returntype="File" /></a></td>
<td style="vertical-align: middle; height: 95px;"><a href="https://piazza.com/class/kf2pf9kvmlewk?cid=6"><img src="https://wwu.instructure.com/courses/1412042/files/67754372/preview" alt="Microvideos.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67754372" data-api-returntype="File" /></a></td>
<td style="vertical-align: middle; height: 95px;"><a href="https://huxley.wwu.edu/sal/spatial-analysis-lab-sal"><img src="https://wwu.instructure.com/courses/1412042/files/67759034/preview" alt="SAL.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67759034" data-api-returntype="File" /></a></td>
<td style="height: 95px;"><a title="Meet your instructional staff" href="https://wwu.instructure.com/courses/1412042/pages/Meet%20your%20instructional%20staff?titleize=0" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/pages/Meet%20your%20instructional%20staff" data-api-returntype="Page"><img src="https://wwu.instructure.com/courses/1412042/files/67756220/preview" alt="Meetus.png" width="90" height="99" data-api-endpoint="https://wwu.instructure.com/api/v1/courses/1412042/files/67756220" data-api-returntype="File" /></a></td>
</tr>
<tr style="height: 37px;">
<td style="text-align: right; vertical-align: middle; height: 10px; width: 105.556px;"></td>
<td style="width: 105.556px; height: 10px;"></td>
<td style="width: 105.556px; height: 10px;"></td>
<td style="width: 105.556px; height: 10px;"></td>
<td style="width: 105.556px; height: 10px;"></td>
<td style="width: 155px; height: 10px;"></td>
</tr>
</tbody>
</table>

Labels (1)
Tags (2)
0 Kudos
1 Reply
Highlighted
Community Coach
Community Coach

Hi!

Unfortunately, sometimes that happens when tables are used to house images. Would you be able to reestablish that page without the table and use the percentage size for your images? Though, with that, be careful how small they get. 10% on a large screen is different than 10% on a mobile device.

Top Kudoed Authors
Labels