pre text too small

[urbanreader]

urbanreader last edited by

One of my webpages - http://www.urbanrim.org.uk/drop chart.htm - requires twice-weekly embedding of output from a computer program. When I designed the page (way back) I carefully aligned the embedded material within the rest of the page using:

pre {
color:#0f0f0f;
font: normal 1.0em courier new, courier, monospace;
line-height:18px;
margin:0px auto;
text-align:left;
width:740px;
}

The output is then copied and pasted between pre and /pre tags.

This works well on all browsers, including Opera - until recently.

Along comes v26.0 and the embedded section is too small in overall height. Alignment is lost.

Any suggestions?

[Deleted User]

Deleted User last edited by

Please show a screenshot, i cant find any misalignment, not in Opera 26, nor in 27 BETA, not even in 28 DEVELOPER.

[urbanreader]

urbanreader last edited by

gwen-dragon, thank you for your response.

The page is perhaps too long for a screenshot. I think the best way to demonstrate what I mean is to view the same page in another browser.

In Opera, the inserted section ends far short of the intended position, leaving a significant gap between it and the Calculator. None of the various parts of the chart line up as they should with 'repeater' menu boxes in the left column.

I have checked the page using two desktops and a tablet, and the problem is apparent on all. No doubt my code needs a tweek but attempts so far have failed to produce a remedy.

[Deleted User]

Deleted User last edited by

The input fields of calulator are to wide.

You can adjust setting width with CSS :

input { width: 1.5em; }

[urbanreader]

urbanreader last edited by

The problem is traced to line-height. Opera 26 seems not to read a px (or any other) line-height value as other browsers, at least as regards text copied from Notepad and pasted within pre /pre. I'm probably missing something simple.

[sgunhouse]

sgunhouse Moderator Volunteer last edited by

The calculator - way at the bottom of the page? The formatting says "top: 10656 px" - perhaps you shouldn't be using absolute positioning?

Everything looks identical in Chrome - as you'd expect since both browsers use the same engine.

[Deleted User]

Deleted User last edited by

Opera 26 seems not to read a px (or any other) line-height value as other browsers,

Opera 26 can use px and relative values as line-height.

[urbanreader]

urbanreader last edited by

Thanks for responses. I've decided to do some page 'restructuring' over the hols so that length of the pasted chart section is no longer an issue.