Page 1 of 1

Internal browser not fully CSS compliant?

Posted: Fri Mar 28, 2014 7:27 pm
by Frank Ralf
Hello,

I'm trying to modify the CSS for oXygen's Author mode so frames around figures resemble the PDF output. Normal figures should be "shrink-wrapped" (http://haslayout.net/css-tuts/CSS-Shrink-Wrap), figures with the attribute @expanse="page" should span the whole page width.

The HTML test code below does work in Firefox and Internet Explorer but not in oXygen so I suppose the internal browser is not fully CSS compliant. Is my suspicion correct or am I missing something?

Kind regards,
Frank

Code: Select all

<!DOCTYPE html SYSTEM "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>CSS Shrink-wrap Test</title>
    <style type="text/css">

/* Shrink-wrapping with CSS 
   http://haslayout.net/css-tuts/CSS-Shrink-Wrap
*/
div.figwrap {
  overflow: hidden;
  display: inline-block;
  padding: 10px;
}

div.figwrap { display: block; }

div.fig{
  padding: 5px;
  border: 2px solid #007088;
  float: left;
}

div.fig[expanse = "page"]{
  width:98%;
}

div.fig div.title {
  border: 1px solid fuchsia;
}

div.fig img {
  border: 1px solid lime;
}

</style>
   
  </head>
  <body>
    <div class="figwrap">
      <div class="fig">
        <div class="title">Shrink-wrap frame - even when it's wider than the picture</div>
        <img src="dita-bird_0.jpg" alt="shrink-wrap"/>
      </div>
    </div>
    <div class="figwrap">
      <div class="fig" expanse="page">
        <div class="title">Whole width frame</div>
        <img src="dita-bird_0.jpg" alt="whole width"/>
      </div>
    </div>
  </body>
</html>



PS:
Is there a way to upload a screenshot here?

Re: Internal browser not fully CSS compliant?

Posted: Mon Mar 31, 2014 10:59 am
by Radu
Hi Frank,

The HTML test code below does work in Firefox and Internet Explorer but not in oXygen so I suppose the internal browser is not fully CSS compliant. Is my suspicion correct or am I missing something?


The Author visual editing mode is not fully CSS compliant, we mostly implemented features useful for editing content. So you should never rely on the fact that things will look in the visual editing mode exactly as in a web browser.
All the CSS features we implemented are listed here:

http://www.oxygenxml.com/doc/ug-oxygen/index.html#references/dg-standard-css-support.html

Also Oxygen does not yet read the CSS embedded directly inside XHTML documents (like in your case), we'll try to add this improvement in a future version.
Right now the Author visual editing mode in Oxygen only reads and applies the CSS if it is referenced as a separate file using the <style> tag.

PS:
Is there a way to upload a screenshot here?


No, in the future maybe you can upload it to a public web site specialized in image uploads and add a link to it on the forum post.

Regards,
Radu

Re: Internal browser not fully CSS compliant?

Posted: Tue Apr 01, 2014 1:55 pm
by Frank Ralf
Thanks for the quick response and the thorough explanation!

Re: Internal browser not fully CSS compliant?

Posted: Mon Oct 02, 2017 2:53 pm
by sorin_carbunaru
Hello Frank,

Just to update this thread: the Author mode in 19.1 reads the CSS rules declared inside the (X)HTML document.

All the best wishes,
Sorin Carbunaru
oXygen XML

Re: Internal browser not fully CSS compliant?

Posted: Wed Oct 25, 2017 1:06 pm
by Frank Ralf
Many thanks for the update!

Frank