# Custom font issues in admin-container CSS/HTML editor **URL:** https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986 **Category:** Feature **Created:** [8 Dicembre 2016, 10:25pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986 "2016-12-08T22:25:04Z") **Posts on this page:** 7 **Page:** 1
### Author: ![Joe\_Fedric](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joe_fedric/32/88070_2.png) [@Joe\_Fedric](https://meta.discourse.org/u/Joe_Fedric) #### Post date: [8 Dicembre 2016, 10:25pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/1 "2016-12-08T22:25:04Z")
I’m encountering a spacing problem with the `.admin-container` that is making it a bit rough editing my stuff. Couldn’t find this in another thread, but here is my issue with custom fonts in the `.admin-container` element: > **Example problem** > > ![](https://global.discourse-cdn.com/meta/original/3X/7/6/764f76303435169a98d334ba8e0c3c5e176f9bdb.png) > **Expected behavior** > > ![](https://global.discourse-cdn.com/meta/original/3X/6/d/6d4c3058a7371ad34f30f2e0783d4d7dbe4bd793.png) Essentially, anytime I use a font with a different font width, I see misalignment in the editor panel. Modifying `letter-spacing` attribute doesn’t help. Only setting the default font allows for correct cursor placement. The two screenshots above show the same exact cursor placement. Anyway to use custom fonts in the `admin-container`? I can switch it if no, but I really prefer Roboto over the system font. 🙂 ---
### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco) #### Post date: [8 Dicembre 2016, 10:37pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/2 "2016-12-08T22:37:25Z")
> [@Joe\_Fedric](#): > > Essentially, anytime I use a font with a different font width, I see misalignment in the editor panel. Modifying letter-spacing attribute doesn’t help. Only setting the default font allows for correct cursor placement. The two screenshots above show the same exact cursor placement. If you go directly to the `/admin` family of pages, or just refresh when there, you will see that custom styles are disabled there. And that’s why. ---
### Author: ![Joe\_Fedric](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joe_fedric/32/88070_2.png) [@Joe\_Fedric](https://meta.discourse.org/u/Joe_Fedric) #### Post date: [8 Dicembre 2016, 10:40pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/3 "2016-12-08T22:40:27Z")
Meh… I’d rather just force the font-family that works. When I refresh to ignore the custom style, most of my buttons, etc., are unclickable. I actually find that rather annoying, though it may be helpful for some specific custom CSS issues like `*{display:none;}` being added unintentionally or something silly like that. This doesn’t specifically address the cursor placement issue in `.admin-container`, fwiw. Can I force the cursor to display in the correct location? ---
### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague) #### Post date: [8 Dicembre 2016, 10:50pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/4 "2016-12-08T22:50:13Z")
My guess is it’s the “!important” messing things up. If you add a space before the “!” or remove those does the cursor then appear where it should? ---
### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco) #### Post date: [8 Dicembre 2016, 10:51pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/5 "2016-12-08T22:51:38Z")
> [@Joe\_Fedric](#): > > This doesn’t specifically address the cursor placement issue in .admin-container, fwiw. Can I force the cursor to display in the correct location? I think aceeditor expects a mono-spaced font, try to add a exception for this container with a correct font. ---
### Author: ![Joe\_Fedric](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joe_fedric/32/88070_2.png) [@Joe\_Fedric](https://meta.discourse.org/u/Joe_Fedric) #### Post date: [8 Dicembre 2016, 10:54pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/6 "2016-12-08T22:54:27Z")
No, the `!important` flag doesn’t make a difference. I think using a mono-spaced font is what I need to do. If I’m restricted to monospaced, then I’ll just use default fonts 🙂 ---
### Author: ![Joe\_Fedric](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/joe_fedric/32/88070_2.png) [@Joe\_Fedric](https://meta.discourse.org/u/Joe_Fedric) #### Post date: [8 Dicembre 2016, 11:06pm UTC](https://meta.discourse.org/t/custom-font-issues-in-admin-container-css-html-editor/53986/7 "2016-12-08T23:06:05Z")
Found a monospace flavor of Roboto! `.ace_editor{ font-family:'Roboto Mono', monospace!important; }` I have discovered that !important is required to force the editor to use the font, otherwise it uses one of these fonts: 1. Monaco 2. Menlo 3. Ubuntu Mono 4. Consolas 5. Source Code Pro Thanks for the help everyone. It looks like the editor only plays nice with monospaced fonts. Dur.