problem with css and picture

M

mb301

I am using fp2003 and IE 6.0 if I preview the page in fp-design view
and then in the IE the pictre appears in different places is this a
fault with FP or IE?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Basic 3-Column Sample Page</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
background-color: teal;
margin: 20px;
padding: 0;
font-size: 1.1em;
font-family: verdana, arial, helvetica, sans-serif;
}
h1 {
font-family: verdana, arial, helvetica, sans-serif;
margin: 0 0 15px 0;
padding: 0;
color: #888;
}
h2 {
font-family: verdana, arial, helvetica, sans-serif;
margin: 0 0 5px 0;
padding: 0;
font-size: 1.1em;
}
p {
font-family: verdana, arial, helvetica, sans-serif;
line-height: 1.1em;
margin: 0 0 16px 0;
padding: 0;
}
..content>p {
margin: 0;
}
..content>p+p {
text-indent: 30px;
}
a {
color: teal;
font-family: verdana, arial, helvetica, sans-serif;
font-weight: 600;
text-decoration: none;
}
a:link {
color: teal;
}
a:visited {
color: teal;
}
a:hover {
background-color: #bbb;
}

/* All the content boxes belong to the content class. */
..content {
position: relative;
width: auto;
min-width: 120px;
margin: 0 210px 20px 170px;
border: 1px solid black;
background-color: white;
padding: 10px;
z-index: 3;
}

#navleft {
position: absolute;
width: 128px;
top: 20px;
left: 20px;
font-size: 0.9em;
border: 1px dashed black;
background-color: white;
padding: 10px;
z-index: 2;
}

#navright {
position: absolute;
width: 168px;
top: 20px;
right: 20px;
border: 1px dashed black;
background-color: #eee;
padding: 10px;
z-index: 1;
}
-->
</style>
</head>
<body>

<div class="content">
<h1>Getting the Lay of the Land</h1>
<p>
<img src="<<picture>>.jpg" width="120" height="60" align="right">We
can look at Cascading Style Sheets (CSS) from a number of contextual
perspectives. I prefer to view them as a correction to a fundamental
mistake
that was made at the beginning of Web Time, back in the old days of
the
mid-1990's when Tim Berners-Lee and a subsequent phalanx of Web
builders
first envisioned the beginnings of the Web.</p>
<p>What was that mistake?</p>
</div>

<div class="content">
<h2>CSS in Context</h2>
<p>Almost as soon as the Web became popular, graphic designers began
noticing
what they saw as a fundamental flaw: the method by which a Web browser

displayed information in HTML files was not within the designers'
control.
No, it was the users who were in primary charge of how the Web pages
they
visited would appear on their systems.</p>
</div>

<div class="content">
<h2>Keep Adding Content</h2>
<p>You can see that as you keep adding content to this page, it adds
nicely
boxed and centered material down the center of the page.</p>
</div>

<div id="navleft">
<h2>Some Links</h2>
<p>
<a href="http://www.danshafer.com/"
title="Dan Shafer's Personal Web Site">Dan's Home Page</a><br/>
<a href="http://www.sitepoint.com/"
title="SitePoint Home Base">SitePoint Home</a><br/>
<a href="http://www.sitepointforums.com/"
title="Discussion Board for This Book">Discuss This
Book</a><br/>
<a href="" title="">Fake Link One</a><br/>
<a href="" title="">Nothing Here</a><br/>
<a href="" title="">Links Nowhere</a><br/>
<a href="" title="">Fake Link Four</a><br/>
<a href="" title="">Fifth Fake Link</a><br/>
</p>
</div>

<div id="navright">
<h2>Why CSS is Better</h2>
<p>Style sheets allow you to separate content from its presentation,
which
leads to pages that are more easily reproduced as templates for other
pages
and to vastly easier maintenance. Smaller file sizes, fewer
place-holder
graphics, and faster load times are some of the other benefits of
CSS.</p>
<p>If you have other ideas on this subject,
<a href="mailto:[email protected]">drop me an email</a> and let's
talk
about it!</p>
</div>

</body>
</html>
 
J

Jens Peter Karlsen [FP-MVP]

Preview is just that, a preview. To see what the page really will look
like open it in a browser.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.
 
M

mb301

Jens said:
Preview is just that, a preview. To see what the page really will look
like open it in a browser.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.


If you cut and past the above code the pciture is behind the content.
But in the design sceen its in the right place.????
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top