Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fieldset legend heading XL cutting off descender #1476

Closed
ChazUK opened this issue Jul 2, 2019 · 1 comment
Closed

Fieldset legend heading XL cutting off descender #1476

ChazUK opened this issue Jul 2, 2019 · 1 comment

Comments

@ChazUK
Copy link

ChazUK commented Jul 2, 2019

The descenders of my headings appear to be getting cut off and the whole heading squashed vertically when trying to use the legend as a heading pattern. I'm using v2.13.0, code below.

<fieldset class="govuk-fieldset">
  <legend class="govuk-fieldset__legend govuk-fieldset__legend--xl">
    <h1 class="govuk-fieldset__heading">
      Sign In
    </h1>
  </legend>
</fieldset>

legend has these computed styles:

border-bottom-color: rgb(11, 12, 12);
border-bottom-style: none;
border-bottom-width: 0px;
border-image-outset: 0px;
border-image-repeat: stretch;
border-image-slice: 100%;
border-image-source: none;
border-image-width: 1;
border-left-color: rgb(11, 12, 12);
border-left-style: none;
border-left-width: 0px;
border-right-color: rgb(11, 12, 12);
border-right-style: none;
border-right-width: 0px;
border-top-color: rgb(11, 12, 12);
border-top-style: none;
border-top-width: 0px;
box-sizing: border-box;
color: rgb(11, 12, 12);
display: table;
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-size: 48px;
font-weight: 700;
height: 50px;
line-height: 50px;
margin-bottom: 15px;
max-width: 100%;
overflow-x: hidden;
overflow-y: hidden;
padding-bottom: 0px;
padding-inline-end: 0px;
padding-inline-start: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
white-space: normal;
width: 158px;
-webkit-font-smoothing: antialiased;
-webkit-border-image: none;

h1 has these computed styles

color: rgb(11, 12, 12);
display: block;
font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-size: 48px;
font-weight: 700;
height: 50px;
line-height: 50px;
margin-block-end: 0px;
margin-block-start: 0px;
margin-bottom: 0px;
margin-inline-end: 0px;
margin-inline-start: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
white-space: normal;
width: 158px;
-webkit-font-smoothing: ant

Screenshot 2019-07-02 at 18 07 36

Screenshot 2019-07-02 at 18 08 08

@36degrees 36degrees transferred this issue from alphagov/govuk-design-system-backlog Jul 3, 2019
@36degrees
Copy link
Contributor

@ChazUK thanks very much for taking the time to report this.

I believe this is the same issue recorded in #1239, so I'm going to close this. I'd recommend subscribing to receive updates to that issue if you want to be updated on any activity.

If you believe this is a separate issue to the one recorded in #1239, please feel free to re-open this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants