0

I converted PDF files to HTML individual files. When it successfully converted to html the text position is similar to where it was in the PDF(this is good). The size of the PDF is 8.5 by 11, my problem is when it was converted to html Text are positioned in absolute positioning, so when I view it in the mobile webview the texts overflows.

Can someone here have similar problems regarding this? How to make the absolute position div/p fit any screen? I wanted to make the html content looks the same the pdf file.

Thanks in advance.

user1828473
  • 61
  • 1
  • 4
  • hi you can wrap your `absolute` **div** with `relative` position – jhunlio Feb 28 '13 at 04:52
  • Actually, right now all DIVs with absolute positioning are inside the parent relative positioned DIV. I wanted to adjust the width&height of the device based on screen (just like when you view pdf in any device). I don't want to retain the 918x1188(this is the pixel size of the parent relative DIV). Lets say I have a 2x3 inch device, i want the "whole" page to render... – user1828473 Feb 28 '13 at 10:41
  • *I wanted to adjust the width&height of the parent DIV based on screen – user1828473 Feb 28 '13 at 11:16
  • hi.. don't use pixel for width make your layout more fixable use `%` make it `100%` and i suggest use media Queries in targeting device screen width – jhunlio Mar 01 '13 at 00:21

2 Answers2

0

html

<div class="Wrap">
      <div class="inside">
      </div>
    </div>

css

.wrap {
float:left;
position:relative
}

.inside {
float:left;
position:absolute
}

hope this help

by the way use percentage % for the width

jhunlio
  • 2,550
  • 4
  • 26
  • 45
0

Use your font size vw instead of px. if you are using

h1 {
    font-size: 15px;
}

then you have to use

h1 {
    font-size: 4.5vw;
}

only once. No need to write for every media css.

I hope this will help you.

leonardkraemer
  • 6,573
  • 1
  • 31
  • 54