Skip to content

Plain logo (set via page)

Description: Added a logo via the page editor by choosing override default logo option. No additional HTML/CSS/JS applied outside of default module.

Current behavior (pre-ungate): Logo should render with normal height/width dimensions set via page editor

Plain logo (set via settings)

Description: Logo in this case pulls in from site settings. No additional HTML/CSS/JS applied outside of default module.

Current behavior (pre-ungate): Logo should render with normal height/width dimensions set via site settings

Max-width set

Description: Logo with a max-width of 100% (very common style applied on logos)

Current behavior (pre-ungate): Logo should not exceed 100% of the container (this test logo is intentionally larger than the container it is in). The logo should also not distort (e.g. if it hits the maximum width the height should be relative to the width). 

Max-height set

Description: Logo with a max-height of 50px 

Current behavior (pre-ungate): Logo should not exceed 50px in height and the width should scale with the height if the height max is reached (e.g. logo shouldn't look distorted)

Max-width + height auto set

Description: Logo with a max-width of 100% and height of auto

Current behavior (pre-ungate): Logo should not exceed 100% of the container (this test logo is intentionally larger than the container it is in). The logo should also not distort (e.g. if it hits the maximum width the height should be relative to the width). 

Max-height + width auto set

Description: Logo with a max-height of 50px and width of auto

Current behavior (pre-ungate): Logo should not exceed 50px in height and the width should scale with the height if the height max is reached (e.g. logo shouldn't look distorted)

Max-width + height set

Description: Logo with a max-width of 100% and height set to 100px

Current behavior (pre-ungate): Image will have a height of 100px set. This will be distorted in this example however because the width is set via the image inline styles so that means it doesn't scale properly with the height in this case. 

Max-height + width set

Description: Logo with a max-height of 100% and width of 100px

Current behavior (pre-ungate): Image will be 100px wide and height scales proportionally (because there is no height set inline)

Min-width set

Description: Min-width of 100px set

Current behavior (pre-ungate): The logo will at least be 100px wide (unless image dimensions were larger)

Min-height set

Description: Min-height of 100px set

Current behavior (pre-ungate): The logo will at least be 100px tall (unless image dimensions were larger)

Min-width and height auto set

Description: Min-width of 100px and height auto set

Current behavior (pre-ungate): The logo will at least be 100px wide (unless image dimensions were larger)

Min-height and width auto set

Description: Min-height of 100px and width auto set

Current behavior (pre-ungate): The logo will at least be 100px tall (unless image dimensions were larger)

Min-width and height set

Description: Min-width of 100px and height 150px set

Current behavior (pre-ungate): The logo will at least be 100px tall and should have a height specific to 150px (if the proportional width is less than 100px the image will not scale proportionally)

Min-height and width set

Description: Min-height of 50px and width 150px set

Current behavior (pre-ungate): The logo will at least be 50px tall and the width in this case wouldn't apply unless it had an !important tag so the width should scale proportionally (unless the important tag was applied)

Height + width explicitly set

Description: Logo with a height of 54px and width of 209px !important

Current behavior (pre-ungate): Logo should be those exact dimensions (in this case those match the logo's proportions but the logo has a height/width attribute set to a higher value). The expectation is the styles would still apply to make the image the size set via the logo. 

Height auto + width set

Description: Logo with a height of auto and width of 100px

Current behavior (pre-ungate): Logo should be 100px width and the height should be scaled proportionally

Width auto + height set

Description: Logo with a height of 100px and width of auto !important

Current behavior (pre-ungate): Logo should be 100px tall and the width should be scaled proportionally. 

Height set

Description: Logo with a height of 100px

Current behavior (pre-ungate): Logo should be 100px tall but the width would be expected to be smushed currently because width is automatically set as a style and not just an attribute

Width set

Description: Logo with a width of 100px !important

Current behavior (pre-ungate): Logo should be 100px wide and the height should be scaled proportionally