cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
ProfBee
Community Member

Why are my buttons different sizes?

Jump to solution

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.PNG IMG_4862 2.PNG IMG_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 Solution

Accepted Solutions
klundstrum
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.

View solution in original post

1 Reply
klundstrum
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.

View solution in original post