0

I'm currently going to school and I've started to use html for my study notes. I have 1 html for each chapter and each extra assignment. When exam time comes around, I copy each html into a big html. This works but the problem is when I edit something. Sometimes the individual chapters get edited and sometimes I edit the big file. So this becomes a problem.

Using some of the code I've found on this site, I'm able to load chapter01.html to display in full using iframes. But I can't get chapter2.html to fall in line after chapter01. Combining them makes it easier to do searches and get an ereader to read everything. Our last exam had chapters 1,2,3,9,17, and 3 additional assigned sections.

The files are held locally in my computer or on a jump drive and I use VSCode for editing. I'm a beginner and have done enough to do what I needed from watching tutorials. Until this problem came up. I tried using flexbox as the iframes containers but don't understand it enough.

Just to clear things up. I want to fully load the first html. After that, I want to fully load the 2nd html after the first. And so on preferably without using javascript since I still have to learn this but I'm willing to

Any help would be appreciated.

      body, html {
      margin: 0;
      padding: 0;
      height: 100%;
      overflow: hidden;
      }

      .content1 {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      top: 0;
      }


      .content2 {
      position: relative;
      left: 0;
      right: 0;
      top: 0;
      /* bottom: 0; */
      }
      iframe {
      width: 100%;
      height: 100%;
      display: block;
      }

    <!-- <div class="content1"> -->
    <iframe class="content1" frameborder="0" src="ch03 default done.html" frameborder="0"></iframe>
    <!-- </div> -->
    <!-- <div class="content2"> -->
    <iframe class="content2" frameborder="0" src="ch06 default done.html" frameborder="0"></iframe>
    <!-- </div> -->
</body>

Some things are commented out because I was testing ideas such as inserting the class into the iframe instead of using the div container, seen above. I've tried other things and came up with different results and I'm not sure how to explain those.

Thanks for any help you can give.

Michael Benjamin
  • 346,931
  • 104
  • 581
  • 701
Chex McChex
  • 1
  • 1
  • Hmm...using HTML for class notes seems interesting as you take more time writing syntax than just plain text, but to each their own. I would load your HTML into a 'master' file that holds all notes with JS then you can keep your note modulation and still view a single page. Maybe something like this: https://stackoverflow.com/a/17642783/8382028 – ViaTech Feb 10 '23 at 19:31
  • Typing takes longer but you can dictate (windows logo + H). Emmet integrated into VSCode and using prettier has cleaned up the drudgery of dealing with html syntax. I was also wanting to learn htm, css, and js so getting some good practice in. Don't know js yet. Learned about pseudo class and pseudo elements this weekend but html is 1-2 hrs every 5 days or so. Thanks for your suggestion. I'll definitely keep it in mind. – Chex McChex Feb 12 '23 at 18:49

1 Answers1

0

I'm not entirely sure what you're trying to achieve, but from what I'm understanding, you want to display more than one screen/page in the "main" page.

Ideally, you could just extract the necessary contents on the pages, and display those in a <article>, <main> or <section> tag, respectively.

If you're worried about styling the pages, simply give each one a unique class, or even an id.

You could also simply link to these individual pages.

iframes would work, but as you've noticed, they're not quite as simple to work with.

Best of luck!

Ron Strauss
  • 60
  • 1
  • 7
  • Thanks for the idea. I've seen something like this done but didn't understand it so I'll explore this avenue. I use a section for each chapter for my cut from each chapter html into the big html. And ID on each section will do the job. I've seen javascript code running around somewhere discussing this. – Chex McChex Feb 12 '23 at 18:32