-
1. Re: Positioning problem - CSS
This is how you would achieve the middle fluid section, copy code below
and paste into a new Dreamweaver document and run it through a
browser....it works.
Start adding your other <divs> back in, one by one, view it in the
browser and see if and where it breaks down. I have to say I don't like
what I see too much in your style sheet. I would'nt be doing it like
that but of course there are many ways to achieve the same results so
just take it one step at a time.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html
xmlns=" http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1"><title>John Bigglestone - Wharf Studio, Devizes</title>
<style type="text/css">
body {
height:100%;
max-height:100%;
background-color:#333333;
overflow:hidden;
padding:0;
margin:0;
border:0;
color:#999999;
}
html {
height:100%;
max-height:100%;
padding:0;
margin:0;
border:0;
background-color:#333333;
font-size:80%;
font-family:Geneva, Arial, Helvetica, sans-serif;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
}
.content {
margin-right: 300px;
padding-left: 20px;
}
.photoblock {
width:250px;
float: right;
padding-right: 20px;
padding-left: 20px;
}
</style></head>
<body>
<div class="wrapper">
<div class="photoblock"><img src="slides/01.jpg" width="250"></div>
<div class="content">
<p>The Place<br />
Wharf Studio is located near the centre of Devizes, a country
market town on the edge of Salisbury plain.</p>
<p>The Studio<br />
Five hundred square feet of shooting space, with tungsten and
electronic flash lighting.</p>
<p>The Work<br />
Corporate and advertising photography for a range of clients located
throughout an area from Wales to London and the South Coast.</p>
<p>Largely studio-based (though a significant amount of work is shot
on location), it includes people, products, corporate interiors and
large-scale installations.</p>
<p>Picture destinations include company brochures and annual reports,
roadside and London Underground posters, cover and PR shots in
specialist magazines and college prospectuses.</p>
<p>Computer-based picture manipulation and retouching is available
in-house at Wharf Studio using AppleMac and PC units. Clients often
work alongside staff throughout the process, ensuring optimum results.</p>
</div>
</div>
</body></html>
-
2. Re: Positioning problem - CSS
Hi Osgood
Sorry for late reply.... and thanks for yours.
What don't you like about the style sheet? It is cumbersome, I know.... I
didn't write it all myself, it's adapded from a free style sheet.
The bit I wanted was the fixed footer and I didn't know how to do that hence
copying the bits I needed.
Don't want to waste you time on this but if you felt like it, could you tell
me how you would do it differently?
Thanks and regards
Judi
"Osgood" <notavailable@atthisaddress.com> wrote in message
news:eb4nvi$hla$1@forums.macromedia.com...
> This is how you would achieve the middle fluid section, copy code below
> and paste into a new Dreamweaver document and run it through a
> browser....it works.
>
> Start adding your other <divs> back in, one by one, view it in the browser
> and see if and where it breaks down. I have to say I don't like what I see
> too much in your style sheet. I would'nt be doing it like that but of
> course there are many ways to achieve the same results so just take it one
> step at a time.
>
>
>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html
> xmlns=" http://www.w3.org/1999/xhtml"><head>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1"><title>John Bigglestone - Wharf Studio,
> Devizes</title>
>
> <style type="text/css">
> body {
> height:100%;
> max-height:100%;
> background-color:#333333;
> overflow:hidden;
> padding:0;
> margin:0;
> border:0;
> color:#999999;
> }
> html {
> height:100%;
> max-height:100%;
> padding:0;
> margin:0;
> border:0;
> background-color:#333333;
> font-size:80%;
> font-family:Geneva, Arial, Helvetica, sans-serif;
> /* hide overflow:hidden from IE5/Mac */
> /* \*/
> overflow: hidden;
> /* */
> }
> .content {
> margin-right: 300px;
> padding-left: 20px;
> }
> .photoblock {
> width:250px;
> float: right;
> padding-right: 20px;
> padding-left: 20px;
> }
>
> </style></head>
>
> <body>
>
> <div class="wrapper">
> <div class="photoblock"><img src="slides/01.jpg" width="250"></div>
>
> <div class="content">
> <p>The Place<br />
> Wharf Studio is located near the centre of Devizes, a country market
> town on the edge of Salisbury plain.</p>
> <p>The Studio<br />
> Five hundred square feet of shooting space, with tungsten and electronic
> flash lighting.</p>
> <p>The Work<br />
> Corporate and advertising photography for a range of clients located
> throughout an area from Wales to London and the South Coast.</p>
>
> <p>Largely studio-based (though a significant amount of work is shot on
> location), it includes people, products, corporate interiors and
> large-scale installations.</p>
> <p>Picture destinations include company brochures and annual reports,
> roadside and London Underground posters, cover and PR shots in
> specialist magazines and college prospectuses.</p>
> <p>Computer-based picture manipulation and retouching is available
> in-house at Wharf Studio using AppleMac and PC units. Clients often work
> alongside staff throughout the process, ensuring optimum results.</p>
> </div>
>
> </div>
> </body></html>
>
-
3. Re: Positioning problem - CSS
Judith Kruger wrote:
> Hi Osgood
>
> Sorry for late reply.... and thanks for yours.
>
> What don't you like about the style sheet? It is cumbersome, I know.... I
> didn't write it all myself, it's adapded from a free style sheet.
>
> The bit I wanted was the fixed footer and I didn't know how to do that hence
> copying the bits I needed.
>
> Don't want to waste you time on this but if you felt like it, could you tell
> me how you would do it differently?
If you have tested your page in a variety of browsers and it is working
to your requirements then its ok.
As I said in my previous post there quite a few css ways to achieve the
same results. I just see something in a stylesheet that I'm not familair
with and think this or that could be the cause of problems because its
foreign to me. We all write css in different ways and I can only give
solutions which I'm familiar with.
Your page appears to be working ok now (even in Mac IE5x) If you can get
it to work in MacIE5x then it will almost certainly work in all other
browsers with or without minor tweaks. Whilst this is a pretty much dead
browser it is a good benchmark of how you write css to account for a
number of browsers. All layouts CAN work in MacIE5x so my philosophy is
still write for it. I would not attempt to put the footer at the very
bottom of the browers viewport as it will most likely be broken in some
browser somewhere. I would just let the depth of the content on each
page determine where the footer sits.