This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Dreamweaver > February 2006 > Calling CSS layout experts: please help





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Calling CSS layout experts: please help
Deon

2006-02-12, 6:39 pm

Hi there people with knowledge & experience.

My questions concern this page:

www.caravans.co.za/layout.asp

This is my first experiment with CSS page layout.

This is my CSS:

/* CSS Document */

html, body, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset {
margin: 0 0 1 0;
padding: 0;
border: 0;
background: url(../graphics/caravans_background.jpg);
background-attachment:fixed;
background-repeat: no-repeat;
}

body {
font: 100.01%/135% Verdana, Arial, Helvetica, sans-serif;
color: #666;
background-color: #666;
text-align: center;
margin: 0;
padding: 0;
}

#wrapper {
width: 720px;
margin: 0 auto;
padding: 0 20px;
background-color: #fff;
background: url(../graphics/wrapper-back.jpg);
background-repeat: repeat-y;
/* text-align: center; */
border: 0px solid #fff;
}
#header {
width: 720px;
margin: 0;
padding-top: 10px;
text-align: center;
height: 100px;
vertical-align: middle;
}

#nav {
width: 720px;
margin: 0 10px 0 auto;
padding: 20px 7px 40px 7px;
text-align: center;
}

#leftcol {
float: left;
width: 100px;
border-left: 50px;
border-right: 1px;
padding: 0 20px 0 30px;
background-color:#FFFF99;
}

#content {
width: 300px;
border-left: 1px;
border-right: 20px;
padding: 0 30px 0 10px;
float: right;
background-color:#FFFF99;
text-align: justify;
}


With FireFox:
The background image of my #wrapper, does not repeat all the way down
and stops just before my #leftcol even though it is between the <div> of
my #wrapper. I cannot get the #leftcol & #content DIV's to have a
padding of 20px between the #wrapper image.

With IE 6:
The #wrapper background repeats OK all the way down.
BUT, the background image of my #html, body, etc does not want to stay
fixed and scrolls together with the page.

I have battled with this for hours now and cannot get it working.
I will really appreciate your help.

Regards,
Deon
Pablo

2006-02-12, 6:39 pm

Deon, your font colour is the same as your body background colour. Change
this in body > background-color: #666; to this > background-color: #fff;

> With FireFox:
> The background image of my #wrapper, does not repeat all the way down and
> stops just before my #leftcol even though it is between the <div> of my
> #wrapper. I cannot get the #leftcol & #content DIV's to have a padding of
> 20px between the #wrapper image.


I don't see any problems in FF, why are you using tables?

<table width="800" border="0" align="center" cellpadding="0"
cellspacing="0">Use CSS to control the layout, I think you should go over
the tutorials again.

--
Pablo

Web
.....................................
http://www.dellwebsites.com
.....................................
Photography
.....................................
http://www.dellimages.com
.....................................




"Deon" <deonREMOVE@REMOVEsincro.co.za> wrote in message
news:dsholg$7rn$1@forums.macromedia.com...
> Hi there people with knowledge & experience.
>
> My questions concern this page:
>
> www.caravans.co.za/layout.asp
>
> This is my first experiment with CSS page layout.
>
> This is my CSS:
>
> /* CSS Document */
>
> html, body, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset {
> margin: 0 0 1 0;
> padding: 0;
> border: 0;
> background: url(../graphics/caravans_background.jpg);
> background-attachment:fixed;
> background-repeat: no-repeat;
> }
>
> body {
> font: 100.01%/135% Verdana, Arial, Helvetica, sans-serif;
> color: #666;
> background-color: #666;
> text-align: center;
> margin: 0;
> padding: 0;
> }
>
> #wrapper {
> width: 720px;
> margin: 0 auto;
> padding: 0 20px;
> background-color: #fff;
> background: url(../graphics/wrapper-back.jpg);
> background-repeat: repeat-y;
> /* text-align: center; */
> border: 0px solid #fff;
> }
> #header {
> width: 720px;
> margin: 0;
> padding-top: 10px;
> text-align: center;
> height: 100px;
> vertical-align: middle;
> }
>
> #nav {
> width: 720px;
> margin: 0 10px 0 auto;
> padding: 20px 7px 40px 7px;
> text-align: center;
> }
>
> #leftcol {
> float: left;
> width: 100px;
> border-left: 50px;
> border-right: 1px;
> padding: 0 20px 0 30px;
> background-color:#FFFF99;
> }
>
> #content {
> width: 300px;
> border-left: 1px;
> border-right: 20px;
> padding: 0 30px 0 10px;
> float: right;
> background-color:#FFFF99;
> text-align: justify;
> }
>
>
> With FireFox:
> The background image of my #wrapper, does not repeat all the way down and
> stops just before my #leftcol even though it is between the <div> of my
> #wrapper. I cannot get the #leftcol & #content DIV's to have a padding of
> 20px between the #wrapper image.
>
> With IE 6:
> The #wrapper background repeats OK all the way down.
> BUT, the background image of my #html, body, etc does not want to stay
> fixed and scrolls together with the page.
>
> I have battled with this for hours now and cannot get it working.
> I will really appreciate your help.
>
> Regards,
> Deon



Pablo

2006-02-12, 6:39 pm

Duh, blinded by the light there :)

I WILL BE BACK :)


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dshumn$6or$1@forums.macromedia.com...
> Deon, your font colour is the same as your body background colour. Change
> this in body > background-color: #666; to this > background-color: #fff;
>
>
> I don't see any problems in FF, why are you using tables?
>
> <table width="800" border="0" align="center" cellpadding="0"
> cellspacing="0">Use CSS to control the layout, I think you should go over
> the tutorials again.
>
> --
> Pablo
>
> Web
> ....................................
> http://www.dellwebsites.com
> ....................................
> Photography
> ....................................
> http://www.dellimages.com
> ....................................
>
>
>
>
> "Deon" <deonREMOVE@REMOVEsincro.co.za> wrote in message
> news:dsholg$7rn$1@forums.macromedia.com...
>
>



Pablo

2006-02-12, 6:39 pm

Deon,

If I were you I'd go for a real simple layout and add to that as you learn
or you will end up on a sticky wicket IMHO. I really think you should get
rid of the caravan background image, use the wrapper bg as the body bg. Use
this CSS and go from there: ps, you'd better check this in IE as well. With
a footer and and content bg it will look cool :) pps: nuke the dropdowns :)
ppps: this is just an idea, I understand if you don't like it, I will just
hate you afterwards :)




body {
font: 100.01%/135% Verdana, Arial, Helvetica, sans-serif;
color: #666;
background-color: #fff;
text-align: center;
margin: 0;
padding: 0;
background: #000 url(../graphics/wrapper-back.jpg) center;
}

#wrapper {
width: 720px;
margin: 0 auto;
text-align: center;
border: 0px solid #fff;
text-align: left;
}
#header {
margin: 0;
padding-top: 10px;
height: 100px;
}

#nav {
width: 720px;
padding: 20px 7px 40px 7px;
text-align: center;
}

#leftcol {
float: left;
width: 315px;
color:white;
border-right: 2px solid black;
background-color:#333;
margin-left: 10px;
}

#content {
width: 380px;
border-left: 1px;
float: right;
border-left:2px solid black;
background-color:#FFFF99;
margin-right: 10px;
}
#content P {
padding:5px;
font-size: 80%;
}

#leftcol P {
font-size: 70%;
padding:4px;
}


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dshvvh$8f2$1@forums.macromedia.com...
> Duh, blinded by the light there :)
>
> I WILL BE BACK :)
>
>
> "Pablo" <dell@takeoutdellwebsites.com> wrote in message
> news:dshumn$6or$1@forums.macromedia.com...
>
>



Murray *TMM*

2006-02-12, 6:39 pm

The plural of sprite is sprites. The plural of gypsy is gypsies.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dsi10t$9sh$1@forums.macromedia.com...
> Deon,
>
> If I were you I'd go for a real simple layout and add to that as you learn
> or you will end up on a sticky wicket IMHO. I really think you should get
> rid of the caravan background image, use the wrapper bg as the body bg.
> Use this CSS and go from there: ps, you'd better check this in IE as well.
> With a footer and and content bg it will look cool :) pps: nuke the
> dropdowns :) ppps: this is just an idea, I understand if you don't like
> it, I will just hate you afterwards :)
>
>
>
>
> body {
> font: 100.01%/135% Verdana, Arial, Helvetica, sans-serif;
> color: #666;
> background-color: #fff;
> text-align: center;
> margin: 0;
> padding: 0;
> background: #000 url(../graphics/wrapper-back.jpg) center;
> }
>
> #wrapper {
> width: 720px;
> margin: 0 auto;
> text-align: center;
> border: 0px solid #fff;
> text-align: left;
> }
> #header {
> margin: 0;
> padding-top: 10px;
> height: 100px;
> }
>
> #nav {
> width: 720px;
> padding: 20px 7px 40px 7px;
> text-align: center;
> }
>
> #leftcol {
> float: left;
> width: 315px;
> color:white;
> border-right: 2px solid black;
> background-color:#333;
> margin-left: 10px;
> }
>
> #content {
> width: 380px;
> border-left: 1px;
> float: right;
> border-left:2px solid black;
> background-color:#FFFF99;
> margin-right: 10px;
> }
> #content P {
> padding:5px;
> font-size: 80%;
> }
>
> #leftcol P {
> font-size: 70%;
> padding:4px;
> }
>
>
> "Pablo" <dell@takeoutdellwebsites.com> wrote in message
> news:dshvvh$8f2$1@forums.macromedia.com...
>
>



Pablo

2006-02-12, 6:39 pm

Spritfires :)



"Murray *TMM*" <forums@HAHAgreat-web-sights.com> wrote in message
news:dsi214$b79$1@forums.macromedia.com...
> The plural of sprite is sprites. The plural of gypsy is gypsies.
>
> --
> Murray --- ICQ 71997575
> Team Macromedia Volunteer for Dreamweaver
> (If you *MUST* email me, don't LAUGH when you do so!)
> ==================
> http://www.dreamweavermx-templates.com - Template Triage!
> http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
> http://www.dwfaq.com - DW FAQs, Tutorials & Resources
> http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
> ==================
>
>
> "Pablo" <dell@takeoutdellwebsites.com> wrote in message
> news:dsi10t$9sh$1@forums.macromedia.com...
>
>



Deon

2006-02-12, 6:39 pm

Thanx Pablo for your help.

Deon.


Pablo wrote:
> Duh, blinded by the light there :)
>
> I WILL BE BACK :)
>
>
> "Pablo" <dell@takeoutdellwebsites.com> wrote in message
> news:dshumn$6or$1@forums.macromedia.com...
>
>
>

Deon

2006-02-12, 6:39 pm

Murray *TMM* wrote:
> The plural of sprite is sprites. The plural of gypsy is gypsies.
>

Murray,

These are Gypsey, and is a brand name and therefor Gypsey's.

Deon
Deon

2006-02-12, 6:39 pm

Pablo, thanx again for your help.

I think I got it now. Before I go any further, I want to make sure I do
not mess up.

When you go to www.caravans.co.za\layout.asp

When having a look at this page in FireFox, there's a margin at the
bottom. When viewing it in IE 6, there's no margin. How can I fix this
that there is so margin at the bottom in FF.

Regards,

Deon



Pablo wrote:
> Deon, your font colour is the same as your body background colour. Change
> this in body > background-color: #666; to this > background-color: #fff;
>
>
>
>
> I don't see any problems in FF, why are you using tables?
>
> <table width="800" border="0" align="center" cellpadding="0"
> cellspacing="0">Use CSS to control the layout, I think you should go over
> the tutorials again.
>

Deon

2006-02-12, 6:39 pm

Sorry, here's the correct link:

http://www.caravans.co.za/layout.asp




Deon wrote:[color=darkred]
> Pablo, thanx again for your help.
>
> I think I got it now. Before I go any further, I want to make sure I do
> not mess up.
>
> When you go to www.caravans.co.za\layout.asp
>
> When having a look at this page in FireFox, there's a margin at the
> bottom. When viewing it in IE 6, there's no margin. How can I fix this
> that there is so margin at the bottom in FF.
>
> Regards,
>
> Deon
>
>
>
> Pablo wrote:
>
Pablo

2006-02-12, 6:39 pm

Your css has gone AWOL what have you done to it? Put the id's back, leftcol
etc.


"Deon" <deonREMOVE@REMOVEsincro.co.za> wrote in message
news:dsi32e$7rn$3@forums.macromedia.com...[color=darkred]
> Pablo, thanx again for your help.
>
> I think I got it now. Before I go any further, I want to make sure I do
> not mess up.
>
> When you go to www.caravans.co.za\layout.asp
>
> When having a look at this page in FireFox, there's a margin at the
> bottom. When viewing it in IE 6, there's no margin. How can I fix this
> that there is so margin at the bottom in FF.
>
> Regards,
>
> Deon
>
>
>
> Pablo wrote:


Pablo

2006-02-12, 6:39 pm

Also, add a footer.

css:
}
#footer {
clear:both;
}}
#footer p{
padding:6px;
}and insert a div after</div>
<!-- content ends -->So:</div>
<!-- content ends --><div id="footer">This is the footer div, used for
footer text or whatever </div>Make sure you put the other styles back into
your css file, it's dificult to keep up like this :)"Pablo"
<dell@takeoutdellwebsites.com> wrote in message
news:dsi3eh$d3d$1@forums.macromedia.com...
> Your css has gone AWOL what have you done to it? Put the id's back,
> leftcol etc.
>
>
> "Deon" <deonREMOVE@REMOVEsincro.co.za> wrote in message
> news:dsi32e$7rn$3@forums.macromedia.com...
>
>



Murray *TMM*

2006-02-12, 6:39 pm

There is no apostrophie needed. There is no possessive. The plural would
therefore be Gypseys.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Deon" <deonREMOVE@REMOVEsincro.co.za> wrote in message
news:dsi35d$7rn$4@forums.macromedia.com...
> Murray *TMM* wrote:
> Murray,
>
> These are Gypsey, and is a brand name and therefor Gypsey's.
>
> Deon



Deon

2006-02-12, 6:39 pm

Murray *TMM* wrote:
> There is no apostrophie needed. There is no possessive. The plural would
> therefore be Gypseys.
>

OK, thanx - english is my 3rd language. I'll fix it.

Deon
Pablo

2006-02-12, 6:39 pm

Dogs dinner again, sorry

Also, add a footer.

css:

}
#footer {
clear:both;
}
}
#footer p{
padding:6px;
}

HTML insert a div after

</div>
<!-- content ends -->

So:

</div>
<!-- content ends -->

<div id="footer">This is the footer div, used for footer text or whatever
</div>


Make sure you put the other styles back into your css file, it's dificult to
keep up like this :)"



"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dsi3sd$dna$1@forums.macromedia.com...
> Also, add a footer.
>
> css:
> }
> #footer {
> clear:both;
> }}
> #footer p{
> padding:6px;
> }and insert a div after</div>
> <!-- content ends -->So:</div>
> <!-- content ends --><div id="footer">This is the footer div, used for
> footer text or whatever </div>Make sure you put the other styles back into
> your css file, it's dificult to keep up like this :)"Pablo"
> <dell@takeoutdellwebsites.com> wrote in message
> news:dsi3eh$d3d$1@forums.macromedia.com...
>
>



Murray *TMM*

2006-02-12, 6:40 pm

I'd rather you do that to P@tty, Pblo.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dsi679$gu2$1@forums.macromedia.com...
> Your only here to get closer to me :)
>
> Hey btw, I've visited your forum, I hope you don't mind if I call Murry
> names and stuff :)
>
>
> --
> Pablo
>
> Web
> ....................................
> http://www.dellwebsites.com
> ....................................
> Photography
> ....................................
> http://www.dellimages.com
> ....................................
> "P@tty Ayers" <patty@REMOVEcarolinawebsolutions.com> wrote in message
> news:dsi5tt$gk8$1@forums.macromedia.com...
>
>



Pablo

2006-02-12, 6:40 pm

Your only here to get closer to me :)

Hey btw, I've visited your forum, I hope you don't mind if I call Murry
names and stuff :)


--
Pablo

Web
.....................................
http://www.dellwebsites.com
.....................................
Photography
.....................................
http://www.dellimages.com
.....................................
"P@tty Ayers" <patty@REMOVEcarolinawebsolutions.com> wrote in message
news:dsi5tt$gk8$1@forums.macromedia.com...
>
> "Pablo" <dell@takeoutdellwebsites.com> wrote in message
> news:dshumn$6or$1@forums.macromedia.com...
>
> Pablo, what are you doing here - didn't you see the subject line?
>
>
> --
> Patty Ayers | www.WebDevBiz.com
> Free Articles on the Business of Web Development
> Web Design Contract, Estimate Request Form, Estimate Worksheet
> --
>
>



Josie1one

2006-02-12, 6:40 pm

Ah, Afrikaans being first I imagine? Hoe gaan dit met jou? I lived there for
20+ years and all but forgotten it though!
Jo

"Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
news:dsi51f$f9n$1@forums.macromedia.com...
> Murray *TMM* wrote:
> OK, thanx - english is my 3rd language. I'll fix it.
>
> Deon



P@tty Ayers

2006-02-12, 6:40 pm


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dshumn$6or$1@forums.macromedia.com...

Pablo, what are you doing here - didn't you see the subject line?


--
Patty Ayers | www.WebDevBiz.com
Free Articles on the Business of Web Development
Web Design Contract, Estimate Request Form, Estimate Worksheet
--


Deon

2006-02-12, 6:40 pm

Reg geraai - baie goed dankie!

Keep well!
Deon


Josie1one wrote:
> Ah, Afrikaans being first I imagine? Hoe gaan dit met jou? I lived there for
> 20+ years and all but forgotten it though!
> Jo
>
> "Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
> news:dsi51f$f9n$1@forums.macromedia.com...
>
>
>
>

Deon

2006-02-12, 6:40 pm

Pablo,
thanx again for your expert help.

I have updated it a bit, excluding the footer. I'm trying to familiarize
myself with the padding and margins and width of DIVs.

Please have a look again at www.caravans.co.za/layout.asp

Why does FireFox handle this ruling

padding: 20px 0 20px 0;

different to IE6?

I'm also having difficulty to center my menu as I'm not sure how wide it is.

Deon



Pablo wrote:
> Also, add a footer.
>
> css:
> }
> #footer {
> clear:both;
> }}
> #footer p{
> padding:6px;
> }and insert a div after</div>
> <!-- content ends -->So:</div>
> <!-- content ends --><div id="footer">This is the footer div, used for
> footer text or whatever </div>Make sure you put the other styles back into
> your css file, it's dificult to keep up like this :)"Pablo"
> <dell@takeoutdellwebsites.com> wrote in message
> news:dsi3eh$d3d$1@forums.macromedia.com...
>
>
>

Pablo

2006-02-12, 6:40 pm

It's a question of maths and flow, forget IE for the moment, IE is fine it's
your layout that needs tweaking. Have you seen your page when you enlarge
the text? The nav drops, your wrapper div is width: 700px so you have bags
of room, I would go 780px, adjust the bg image, insert all the css as I told
you earlier and take things from there. You are going in circles mate.

#nav

What's with this? margin: 0 auto 0 auto;

Also change text-align: center; to text-align: left; in the wrapper div



"Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
news:dsia2e$m7u$1@forums.macromedia.com...[color=darkred]
> Pablo,
> thanx again for your expert help.
>
> I have updated it a bit, excluding the footer. I'm trying to familiarize
> myself with the padding and margins and width of DIVs.
>
> Please have a look again at www.caravans.co.za/layout.asp
>
> Why does FireFox handle this ruling
>
> padding: 20px 0 20px 0;
>
> different to IE6?
>
> I'm also having difficulty to center my menu as I'm not sure how wide it
> is.
>
> Deon
>
>
>
> Pablo wrote:

Deon

2006-02-12, 6:40 pm

Ok, Pablo, will try.

The auto-thing I got from Al parber on a question on how to center my
Project VII menu. This was his reply:

To center your menu, you will need to wrap it inside a DIV, nested in
your current menu container, give that DIV a width, and then use auto
margins left and right to center that div.


Deon


Pablo wrote:
> It's a question of maths and flow, forget IE for the moment, IE is fine it's
> your layout that needs tweaking. Have you seen your page when you enlarge
> the text? The nav drops, your wrapper div is width: 700px so you have bags
> of room, I would go 780px, adjust the bg image, insert all the css as I told
> you earlier and take things from there. You are going in circles mate.
>
> #nav
>
> What's with this? margin: 0 auto 0 auto;
>
> Also change text-align: center; to text-align: left; in the wrapper div
>
>
>
> "Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
> news:dsia2e$m7u$1@forums.macromedia.com...
>
>

Murray *TMM*

2006-02-12, 6:40 pm

That would be margin:0 auto - there's no need to repeat them.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
news:dsiclk$pf8$1@forums.macromedia.com...[color=darkred]
> Ok, Pablo, will try.
>
> The auto-thing I got from Al parber on a question on how to center my
> Project VII menu. This was his reply:
>
> To center your menu, you will need to wrap it inside a DIV, nested in your
> current menu container, give that DIV a width, and then use auto margins
> left and right to center that div.
>
>
> Deon
>
>
> Pablo wrote:


P@tty Ayers

2006-02-12, 6:40 pm


"Pablo" <dell@takeoutdellwebsites.com> wrote in message
news:dsi679$gu2$1@forums.macromedia.com...
> Your only here to get closer to me :)
>
> Hey btw, I've visited your forum, I hope you don't mind if I call Murry
> names and stuff :)


Fine, as long as they aren't religious names. :-D


--
Patty Ayers | www.WebDevBiz.com
Free Articles on the Business of Web Development
Web Design Contract, Estimate Request Form, Estimate Worksheet
--


Deon

2006-02-12, 6:41 pm

Pablo wrote:
> It's a question of maths and flow, forget IE for the moment, IE is fine it's
> your layout that needs tweaking. Have you seen your page when you enlarge
> the text? The nav drops, your wrapper div is width: 700px so you have bags
> of room, I would go 780px, adjust the bg image, insert all the css as I told
> you earlier and take things from there. You are going in circles mate.
>
> #nav
>
> What's with this? margin: 0 auto 0 auto;
>
> Also change text-align: center; to text-align: left; in the wrapper div
>

Pablo,

thanx so much for your time & patience - I appreciate it very much. As
this is my first CSS effort, I want to make it right and learn also why
what is done.
The @wrapper width of 770px comes from a tutorial on DW's site I have
done; to accommodate people with a screen width of 800. I have noticed
that in my #wrapper, when I INCREASE the left & right padding, I have to
decrease the #wrapper width - is this correct?

Do you mean that I can increase my background image of the wrapper to
780px without having to decrease it when having padding of 10 or 20px?

Thanx again.
Deon
Deon

2006-02-12, 6:41 pm

Pablo wrote:
> It's a question of maths and flow, forget IE for the moment, IE is fine it's
> your layout that needs tweaking. Have you seen your page when you enlarge
> the text? The nav drops, your wrapper div is width: 700px so you have bags
> of room, I would go 780px, adjust the bg image, insert all the css as I told
> you earlier and take things from there. You are going in circles mate.



Pable, I just had a look at http://www.dellwebsites.com/ and have
noticed that the text of the menu does not increase when the other text
enlarges. How is this done?

Deon
Pablo

2006-02-12, 6:42 pm

Padding is basically the space between the margin, border and the content.
What tutorial are you going through?


"Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
news:dsiqg3$epq$1@forums.macromedia.com...
> Pablo wrote:
> Pablo,
>
> thanx so much for your time & patience - I appreciate it very much. As
> this is my first CSS effort, I want to make it right and learn also why
> what is done.
> The @wrapper width of 770px comes from a tutorial on DW's site I have
> done; to accommodate people with a screen width of 800. I have noticed
> that in my #wrapper, when I INCREASE the left & right padding, I have to
> decrease the #wrapper width - is this correct?
>
> Do you mean that I can increase my background image of the wrapper to
> 780px without having to decrease it when having padding of 10 or 20px?
>
> Thanx again.
> Deon



Pablo

2006-02-12, 6:42 pm

That navbar is an image, it moves on mouse over, look here
http://www.dellwebsites.com/copy/dell_images/navbar.gif

Then go here http://www.dellwebsites.com/web/box/checkthisout.html

But don't do a navbar like this, just get what you are doing sorted and move
on form there.


--
Pablo

Web CSS Templates
.....................................
http://www.dellwebsites.com
.....................................
Photography
.....................................
http://www.dellimages.com
.....................................
"Deon" <deonREMOVEME@REMOVEMEsincro.co.za> wrote in message
news:dsiqso$f6g$1@forums.macromedia.com...
> Pablo wrote:
>
>
> Pable, I just had a look at http://www.dellwebsites.com/ and have noticed
> that the text of the menu does not increase when the other text enlarges.
> How is this done?
>
> Deon



Deon

2006-02-12, 6:43 pm

Pablo wrote:
> That navbar is an image, it moves on mouse over, look here
> http://www.dellwebsites.com/copy/dell_images/navbar.gif
>
> Then go here http://www.dellwebsites.com/web/box/checkthisout.html
>
> But don't do a navbar like this, just get what you are doing sorted and move
> on form there.
>
>

Pablo,

I see now.

The tutorial I'm following now is:

http://www.macromedia.com/devnet/dr...s_concepts.html

I'm learning a lot.

Deon
Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews