cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Resident Rockstar
Resident Rockstar

How to make more detailed formats to html tables (Specific column widths)

I have found some good posts to use </style> to format an html table.  I was hoping to find a way to make columns different fixed widths.  I only see how to make them all fixed, but equal.  Can we do this?

 

 

 

<style>
table{
background-color: #e3e5e8;
text-align:left;
font:arial;
border: 1px solid black;
border-collapse: collapse;
table-layout: fixed;
width: 1800px;
column-width: 300px
}
</style>

 

 

 

Thank you.

1 ACCEPTED SOLUTION

Accepted Solutions
Super User
Super User

Hi @martinav 

 

You can try auto width table(fluid) ,something like following:

<table class="EmailTable" cellspacing="4" cellpadding="2" width="100%" rules="rows" style="border-collapse:collapse;color:#1f2240;background-color:#ffffff">
<caption style="background-color:#ffffff;color:#1f2240;margin-bottom:.5em;font-size:18pt;width:100%;border:0">My Email Table</caption>
<thead style="100%;color:#ffffff;background-color:#1f2240;font-weight:bold">
<tr>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">Number</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">Name</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">A Score</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">B Score</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">C Score</th>
</tr></thead><tbody>
<tr><td>N1</td><td>My Test Name</td><td>0</td><td>75.5</td><td>85.75</td></tr>
<tr><td>N2</td><td>Your Test Name 123</td><td>0</td><td>39.5</td><td>126</td></tr>
<tr><td>N3</td><td>This is an fromated Email</td><td>0</td><td>36</td><td>84</td></tr>
</tbody></table>

 

 

——————————————————
If I have answered your question, please mark your post as Solved.
If you like my response, please give it a Thumbs Up. 

 

View solution in original post

6 REPLIES 6
Super User II
Super User II

hi @martinav  you need to create more css plese see this example

 

http://jsfiddle.net/GlauberRocha/xkuRA/2/



Did I answer your question? Please consider to Mark
my post as a solution! to guide others :winking_face:

Proud to be a Flownaut!


If you want you can follow me at www.christianabata.com Quieres contenido en español? Síguenos en Power Automate LA
Super User
Super User

Hi @martinav 

 

You can try auto width table(fluid) ,something like following:

<table class="EmailTable" cellspacing="4" cellpadding="2" width="100%" rules="rows" style="border-collapse:collapse;color:#1f2240;background-color:#ffffff">
<caption style="background-color:#ffffff;color:#1f2240;margin-bottom:.5em;font-size:18pt;width:100%;border:0">My Email Table</caption>
<thead style="100%;color:#ffffff;background-color:#1f2240;font-weight:bold">
<tr>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">Number</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">Name</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">A Score</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">B Score</th>
<th scope="col" style="background-color:#1f2240;color:white;text-align: left;">C Score</th>
</tr></thead><tbody>
<tr><td>N1</td><td>My Test Name</td><td>0</td><td>75.5</td><td>85.75</td></tr>
<tr><td>N2</td><td>Your Test Name 123</td><td>0</td><td>39.5</td><td>126</td></tr>
<tr><td>N3</td><td>This is an fromated Email</td><td>0</td><td>36</td><td>84</td></tr>
</tbody></table>

 

 

——————————————————
If I have answered your question, please mark your post as Solved.
If you like my response, please give it a Thumbs Up. 

 

View solution in original post

Community Support
Community Support

Hi @martinav ,

 

Please take a try with @DeepakS  and @ChristianAbata 's suggestion and let me know if your problem could be solved.

 

 

Best regards,

Alice       

 

Community Support Team _ Alice Zhang
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

@v-alzhan-msft ,

 

I see you accepted DePaks answer on my behalf as a solution.  For the record, this is fine to format a table with given entries, but not for a table created from other automated means.  

 

I have not had time to revisit this issue.  I will update later.

@martinav @Deepak-S @ChristianAbata .  Can you tell me how to adjust the width of the column when creating a CSV Table, rather than HTML table?

@J-lee  please could you open a new post? I can help you there, this post is already answered



Did I answer your question? Please consider to Mark
my post as a solution! to guide others :winking_face:

Proud to be a Flownaut!


If you want you can follow me at www.christianabata.com Quieres contenido en español? Síguenos en Power Automate LA

Helpful resources

Announcements
Microsoft Ignite

Microsoft Ignite

Join digitally, March 2–4, 2021 to explore new tech that's ready to implement. Experience the keynote in mixed reality through AltspaceVR!

New Super Users

Meet the Power Automate Super Users!

Many congratulations to the Season 1 2021 Flownaut Crew!

Microsoft Ignite

Microsoft Power Platform: 2021 Release Wave 1 Plan

Power Platform release plan for the 2021 release wave 1 describes all new features releasing from April through September 2021.

MPA Community Blog

Power Automate Community Blog

Check out the community blog page where you can find valuable learning material from community and product team members!

Users online (43,825)