Title: Elevation graph layout
Last modified: November 21, 2023

---

# Elevation graph layout

 *  Resolved [ellocosolo](https://wordpress.org/support/users/ellocosolo/)
 * (@ellocosolo)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/elevation-graph-layout/)
 * Hi Joe,
 * I can (almost) promise that this is my last question to you for a while. It’s
   again something regarding the layout. This time the graph elevation. How can 
   I customize the colors of it :
    - x and y axis and numbering (m and km)
    - x and y grid
    - background (a grey that I cannot find in my WP styles on mine)
 * I tried to fiddle with leaflet-elevation.css in the plugin editor, but to no 
   avail… But as you already know, I’m quite a newbie 😉
 * Thanks again for your excellent support 🙂
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Felevation-graph-layout%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Author [Joe](https://wordpress.org/support/users/morehawes/)
 * (@morehawes)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/elevation-graph-layout/#post-17240576)
 * Hi [@ellocosolo](https://wordpress.org/support/users/ellocosolo/),
 * I hope thw following CSS helps:
 *     ```wp-block-code
       <meta http-equiv="content-type" content="text/html; charset=utf-8"></meta>div.waymark-container .elevation-control.elevation .axis text {
         fill: red !important;
       }
       div.waymark-container .elevation-control.elevation .axis path,
       div.waymark-container .elevation-control.elevation .axis line {
         stroke: green !important;
       }
       div.waymark-container .elevation-control.elevation .grid .tick line {
         stroke: blue !important;
       }
       div.waymark-container .elevation-control.elevation .background {
         background-color: pink !important;
       }
       div.waymark-container .waymark-elevation .elevation-control.elevation .area {
         fill: purple !important
       }
       ```
   
 * I have also created an example [here](https://www.waymark.dev/docs/elevation-profile-colours/).
 * Cheers,
 * Joe
 *  Thread Starter [ellocosolo](https://wordpress.org/support/users/ellocosolo/)
 * (@ellocosolo)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/elevation-graph-layout/#post-17241462)
 * Hello Joe,
 * It’s exactly what I needed, and I apologize for being so bad at reading your 
   documentation 🙁
 * Many thanks for the support !
 *  Plugin Author [Joe](https://wordpress.org/support/users/morehawes/)
 * (@morehawes)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/elevation-graph-layout/#post-17245511)
 * [@ellocosolo](https://wordpress.org/support/users/ellocosolo/),
 * > I apologize for being so bad at reading your documentation 🙁
 * I actually didn’t know how to do this myself, so you asking ended up improving
   the documentation! 🙂
 * Thanks,
 * Joe

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Elevation graph layout’ is closed to new replies.

 * ![](https://ps.w.org/waymark/assets/icon-256x256.png?rev=3491393)
 * [Waymark](https://wordpress.org/plugins/waymark/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/waymark/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/waymark/)
 * [Active Topics](https://wordpress.org/support/plugin/waymark/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/waymark/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/waymark/reviews/)

## Tags

 * [layout](https://wordpress.org/support/topic-tag/layout/)

 * 3 replies
 * 2 participants
 * Last reply from: [Joe](https://wordpress.org/support/users/morehawes/)
 * Last activity: [2 years, 6 months ago](https://wordpress.org/support/topic/elevation-graph-layout/#post-17245511)
 * Status: resolved