WordPress.org

Making WordPress.org

Opened 5 years ago

Closed 4 years ago

#728 closed defect (fixed)

Syntax highlighted code blocks get bumped below Topics box

Reported by: coffee2code Owned by: coffee2code
Milestone: Priority: normal
Component: Developer Hub Keywords: needs-patch ui-feedback
Cc:

Description

For handbook pages that contain code early in the content and have a Topics box, the Topics box causes the syntax highlighted code block to flow after/below the Topics. This leaves a big, unsightly gap in the content.

See:

Ideally, the code block would fill the horizontal space available to it and automatically x-scroll if the content exceeds the available width (which is its current behavior when not running up against the Topics box).

Attachments (1)

728.png (158.0 KB) - added by coffee2code 5 years ago.
Screenshot of https://developer.wordpress.org/plugins/administration-menus/sub-menus/ demonstrating issue

Download all attachments as: .zip

Change History (7)

This ticket was mentioned in Slack in #meta-devhub by coffee2code. View the logs.


5 years ago

#2 follow-up: @melchoyce
4 years ago

Changing .syntaxhighlighter from width: 100% to max-width: 100% fixes this:

.syntaxhighlighter {
    max-width: 100%;
}

Any reason why everything has !important?

#3 @coffee2code
4 years ago

  • Owner set to coffee2code
  • Status changed from new to accepted

This ticket was mentioned in Slack in #meta-devhub by coffee2code. View the logs.


4 years ago

#5 in reply to: ↑ 2 @Viper007Bond
4 years ago

Replying to melchoyce:

Any reason why everything has !important?

Without it, many themes would horribly mess up SyntaxHighlighter's styling.

#6 @coffee2code
4 years ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 1380:

developer.wordpress.org: Prevent early-appearing syntax highlighted code blocks from getting bumped below Topics box in handbooks.

Fixes #728.
Props melchoyce.

Note: See TracTickets for help on using tickets.