Opened 9 years ago
Closed 9 years ago
#36158 closed defect (bug) (duplicate)
Dashboard widgets with configure links causing layout issue with screen options
Reported by: |
|
Owned by: | |
---|---|---|---|
Milestone: | Priority: | normal | |
Severity: | normal | Version: | 4.6 |
Component: | Administration | Keywords: | |
Focuses: | ui | Cc: |
Description
I discovered that dashboard widgets that have a configure link are rendering HTML that causes them to be misaligned in the screen options area (see first attached image).
Apparently widgets that have a configure link are generating the link not just on the widget, but below their associated screen option automatically by WordPress. Ex:
<span class="postbox-title-action"><a href="/wp-admin/index.php?edit=blc_dashboard_widget#blc_dashboard_widget" class="edit-box open-box">Configure</a></span>
In the screen options these links are semi-hidden with the following CSS:
.wp-admin .edit-box { display: block; opacity: 0; }
This CSS comes from wp-admin/index.php (I'm not sure where the actual CSS is being included from):
<style type="text/css"> .postbox .button-link .edit-box { display: none; } .wp-admin .edit-box { display: block; opacity: 0; } .hndle:hover .edit-box, .edit-box:focus { opacity: 1; } #dashboard-widgets h2 a { text-decoration: underline; } #dashboard-widgets .hndle .postbox-title-action { float: right; line-height: 1.2; } </style>
This changes the opacity of the span and link, but the elements still take up space since only the opacity is being changed. I'm not sure why these spans exist in the screen options, as they seem to be the same spans on the widgets that displays the configure link.
Solution: They can be hidden via CSS
.metabox-prefs span.postbox-title-action { display: none; }
or via modifying the CSS rules for .metabox-prefs label
and adding vertical-align:top
, however I recommend the display: none
rule as the vertical alignment rule adds extra space below the options and the default layout and behavior is more consistent with the display:none (see second attachment).
I suppose the bigger question is why are configure links being rendered up in the screen options in the first place?
Screen options with configure link causing layout issue