View 2 pages side by side

russcasey · Jul 3, 2011

One of the things I love about using Extended displays or just Windows 7 is the way it is so easy to view two things at once, side by side. I often use this for making notes about a document I'm reading, or writing code and viewing the results at the same time.

One thing that troubled me about ChromeOS is that there is no easy way to view two tabs at the same time. However, I've just found this extension which seems to do the job reasonably elegantly:
https://chrome.google.com/webstore/detail/eldgpcphflnopbjadiaonofideekgdgm

As soon as my CB arrives (don't ask

) I'll report my findings on how it gets on inside ChromeOS.

SilverLining · Jul 3, 2011

Is it not possible to have two instances of Chrome open on the Chromebook? I do that a lot on my current PC - have two separate windows open running Chrome.

russcasey · Jul 3, 2011

SilverLining said:
Is it not possible to have two instances of Chrome open on the Chromebook? I do that a lot on my current PC - have two separate windows open running Chrome.

It is trivial to use 2 windows on a Windows machine, but I don't think chromebooks can do that as they run one maximized chrome window with nothing else. That extension does a similar thing, but using frames within a single tab. It isn't quite such a slick thing to use, but it will put 2 web pages side by side. It _should_ work ok on chromebooks.

alhanson · Jul 5, 2011

Here is the code for embedding two web pages with in a HTML5 page. HTML5 does not use frames (they will not work) it use the <embed> tag.

<!DOCTYPE html>
<html>
<head>
<title>two panel
</title>

<meta charset="utf-8">

<style type="text/css">

article, aside, footer, header, hgroup, nav, section {
display: block;
}

body {
background-color:#F0F8FE;
font-family: Times New Roman, Geneva,Arial,Helvetica,sans-serif;
margin: 0px auto;
max-width: 940px;
border:solid;
border-color:#F0F8FE;
}

section {
width:940px;
padding:0px;
border:1px solid blue;
text-align:center;
margin:0px auto;
height:600px;
}

ul {
list-style-type:none;
padding:10px 0;
clear:both;
}

.column {
float:left;
background-color:;
}

#one {
margin-right:2px;
height:580px;
width:450px;
align: left;
border:1px solid blue;
border-radius: 0px;
-webkit-box-shadow: 0px 0px 0px #888;
background: clear;
}

#two {
margin-right:10px;
height:580px;
width:450px;
align: right;
border:1px solid blue;
border-radius: 0px;
-webkit-box-shadow: 0px 0px 0px #888;
background: clear;
}

aside {
background-color: #F0F8FE;
display:block;
border:1px solid blue;
align: left;
margin: 4px;
padding: 4px;
border-radius: 30px;
}

</style>

</head>
<body>

<section>


<aside class="column" id="one">

<embed src="http://www.google.com/" width="440" height="560" />
</aside>

<aside class="column" id="two">

<embed src="http://www.w3schools.com/html5/tag_link.asp" width="440"

height="560" />

</aside>
</section>

</body>
</html>

past this code into notepad and save with html extension

View 2 pages side by side

russcasey

SilverLining

russcasey

alhanson

Top Contributors this Month