|
Posted by mvbart on 12/20/06 03:38
Thanks for your reply. Abslute positioning is now in 2b. My mistake. In
working with the files, I got the names confused and uploaded two with
relative positions. I'm going to follow your suggestions--including the
name scheme. Appreciate your help.
Michael
John Hosking wrote:
> Michael Bartos wrote:
>
>> I have a web page in two versions of the same page. One uses absolute
>> positioning and the other relative positioning.
>> It's the same problem for each version,
>> #container3, the main body of the web page doesn't "fit" correctly
>> into its slot in Firefox and Netscape.
>>
>> http://www.panamphoenix.com/index2b.htm
>> and http://www.panamphoenix.com/index2c.htm
>>
>
> They both look relative to me.
>
> Here's your CSS, revised:
>
> body {margin-left: 0px; font-family: "Lucida Sans", Verdana; }
>
> #container1 {
> border:0px; width:760px; height:50px;
> background-color:#CC6600; color:#fffbd0;
> padding-top:10px; padding-bottom:0px; }
>
> #container2 {
> border:0px; width:100px; padding-left:10px;
> height:525px; background-color:#FF9900; color:#fff; }
>
> #container3 {
> border:0px; padding-left:25px; padding-right:25px;
> width:600px; height:525px;
> margin-left:110px;
> background-color:#FFFBD0;
> position:relative; top:-525px; left:0px; }
>
> #container4 {
> border:0px; padding-left:25px;
> width:760px; height:40px;
> background-color:#C13100; color:#fff;
> position:relative; top:-525px; left:0px; }
>
> You were leaving the padding out of your calculations. If container2 is
> 525px tall, so should container3 be. And that's how much the negative
> offset vertically should be. The left offset for 3 should be 110px,
> because the width (100) + padding (10) for 2 dictates it. And so on.
>
> BTW, "container2" is kind of a meaningless name for a div; why not
> "samples", "footer", etc.?
>
> Your biggest problem is the fact that you're specifying pixels. Try a
> fluid design and consider that the font sizes might be different.
>
> What happens if a visitor lacks both Lucida Sans and Verdana? Try adding
> sans-serif as the last family. (And drop Verdana.)
>
> Good luck. HTH.
Navigation:
[Reply to this message]
|