Answers.Body: <p>You won't be able to modify the Craft CMS core CMS files (especially if you are using composer as the entire CMS is deployed in the vendor folder), but you can load in your own resources like CSS and JS through an assetbundle in a module, or you can use a plugin like: <a href="https://plugins.craftcms.com/cp-css" rel="nofollow noreferrer">https://plugins.craftcms.com/cp-css</a> to load custom CSS.</p>
  <p>Although, if you think there's an issue in core Craft CMS, you can report an issue to the GitHub page for comment from the developers: <a href="https://github.com/craftcms/cms/issues" rel="nofollow noreferrer">https://github.com/craftcms/cms/issues</a>.</p>
  <p>The CSS rule you have identified will be related to accessibility for screen reader users to skip to the main content on the page.</p>
  <p>Edit: This may have been a bug with Craft CMS, see: <a href="https://github.com/craftcms/cms/issues/11375" rel="nofollow noreferrer">https://github.com/craftcms/cms/issues/11375</a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-05-27T18:38:48.370Z
Answers.LastActivityDate: 2022-06-04T08:03:58.987Z
Answers.LastEditDate: 2022-06-04T08:03:58.987Z
Answers.UserDisplayName: James White
Body: <p>I am running a multi user site on Craft 3. When a new user is trying to set up their password for the first time, the default craft password setup page is not working on mobiles.</p>
  <p>It seems like the following tag is breaking the design:</p>
  <pre><code>&lt;a class=&quot;skip-link btn&quot; href=&quot;#main&quot;&gt;Skip to content&lt;/a&gt;
  </code></pre>
  <p>This tag has the following CSS styles that breaks the design and pushes the password setup form out of the visible part of the screen:</p>
  <pre><code>.skip-link {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: 101;}
  </code></pre>
  <p>Fixing the CSS is easy but I am not sure how can I affect the css that Craft is using by default. As far as I am aware, there is no access to those files.
  Is there a way to affect the default styles?</p>
  
Tags: <users><registration><password>
Title: Password setup screen on mobiles doesn't work properly
ThreadText: # Password setup screen on mobiles doesn't work properly
  
  (Asked by: username_0 on 2022-05-27)
  
  I am running a multi user site on Craft 3. When a new user is trying to set up their password for the first time, the default craft password setup page is not working on mobiles.
  
  It seems like the following tag is breaking the design:
  
  ```
  <a class="skip-link btn" href="#main">Skip to content</a>
  
  ```
  
  This tag has the following CSS styles that breaks the design and pushes the password setup form out of the visible part of the screen:
  
  ```
  .skip-link {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: 101;}
  
  ```
  
  Fixing the CSS is easy but I am not sure how can I affect the css that Craft is using by default. As far as I am aware, there is no access to those files.
  Is there a way to affect the default styles?
  
  **Tags:** users, registration, password
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2022-05-27. Score: 1 | Accepted answer
  
  You won't be able to modify the Craft CMS core CMS files (especially if you are using composer as the entire CMS is deployed in the vendor folder), but you can load in your own resources like CSS and JS through an assetbundle in a module, or you can use a plugin like: <https://plugins.craftcms.com/cp-css> to load custom CSS.
  
  Although, if you think there's an issue in core Craft CMS, you can report an issue to the GitHub page for comment from the developers: <https://github.com/craftcms/cms/issues>.
  
  The CSS rule you have identified will be related to accessibility for screen reader users to skip to the main content on the page.
  
  Edit: This may have been a bug with Craft CMS, see: <https://github.com/craftcms/cms/issues/11375>
  
  
  ---
  
  