CSS Thoughts

[csa]

Okay you Macromedia lot give me your thoughts on this....

I can quite happily design CSS websites in DWMX04 using lots of absolute
placing which works in both IE, FF and N and validates fine. However on every
forum I am being told DONT' USE ABSOLUTE PLACING FOR EVERYING! so do I keep
banging my head against a brick wall trying to position images and text and
then find they don't work in all browsers, or shall I be lazy and carry on as I
have been (well at least till I can figure out how to position stuff properly)?

[Murray *TMM*]

> I can quite happily design CSS websites in DWMX04 using lots of absolute

> placing which works in both IE, FF and N and validates fine.

And makes an awful mess when text is resized in the browser. Do not think
that absolute positioning is something that you need to use to layout pages.
In fact, it would be seldom used by most people.

> banging my head against a brick wall trying to position images and text
> and
> then find they don't work in all browsers

Give me an example, please.

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


"csa" <webforumsuser@macromedia.com> wrote in message
news:djte4k$505$1@forums.macromedia.com...

> Okay you Macromedia lot give me your thoughts on this....
>
> I can quite happily design CSS websites in DWMX04 using lots of absolute
> placing which works in both IE, FF and N and validates fine. However on
> every
> forum I am being told DONT' USE ABSOLUTE PLACING FOR EVERYING! so do I
> keep
> banging my head against a brick wall trying to position images and text
> and
> then find they don't work in all browsers, or shall I be lazy and carry on
> as I
> have been (well at least till I can figure out how to position stuff
> properly)?
>

[csa]

I knew you were ganna tell me bad news!

[url]http://www.thehertsweb.co.uk/css/main.html[/url]

CSS
/* CSS Document */
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background: #ffffff url(images/background.gif) repeat left top;

}
/* Added this to prevent space in mozilla based browsers*/
ul{
/* can change first value here to move nav links down if required */
margin: 0px 0px 0px 10px;
}
#topHeader{
margin-left: 0px;
margin-right: 100px;
margin-top: 0px;
height: 93px;
width: 760px;
background: #ffffff url(images/topheader.gif) no-repeat left top;
}
#menuSide{
position: absolute;
margin-left: 0px;
margin-right: 100px;
margin-top: 0px;
height: 469px;
width: 192px;
background: #F8F400 url(images/homesidemenu.jpg) no-repeat left top;
top: 93px;
left: -1px;
background-color: #E00032;
}
#topCut{
margin-left: 190px;
margin-right: 0px;
margin-top: 0px;
width: 555px;
left: 0px;
top:20px;
height: 20px;
background: #ffffff url(images/topcut.gif) no-repeat left top;
}
#mainContent{
position: absolute;
margin-left: 200px;
margin-right: 200px;
margin-top: 0px;
width: 358px;
left: 1px;
top:117px;
height: 316px;
background-color:#FFFFFF

}
#flexibletxt {
position:relative;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #000000;
margin-left: 50px;
padding: 0px;
word-spacing: normal;
letter-spacing: normal;
width: 300px;
margin-top: 0px;
margin-left: 50px;
text-align:right;
vertical-align:top;
}
img.top {vertical-align:text-top};
#right{
position: absolute;
margin-left: 600px;
margin-right: 200px;
margin-top: 0px;
width: 327px;
left: -32px;
top:118px;
height: 475px;
background-color:#FFFFFF

[Murray *TMM*]

Consider this -

[url]http://www.murraytestsite.com/storage.htm[/url]

No positioning at all.

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


"csa" <webforumsuser@macromedia.com> wrote in message
news:djthm3$akc$1@forums.macromedia.com...

>I knew you were ganna tell me bad news!
>
> [url]http://www.thehertsweb.co.uk/css/main.html[/url]
>
> CSS
> /* CSS Document */
> body {
> margin-left: 0px;
> margin-top: 0px;
> margin-right: 0px;
> margin-bottom: 0px;
> background: #ffffff url(images/background.gif) repeat left top;
>
> }
> /* Added this to prevent space in mozilla based browsers*/
> ul{
> /* can change first value here to move nav links down if required */
> margin: 0px 0px 0px 10px;
> }
> #topHeader{
> margin-left: 0px;
> margin-right: 100px;
> margin-top: 0px;
> height: 93px;
> width: 760px;
> background: #ffffff url(images/topheader.gif) no-repeat left top;
> }
> #menuSide{
> position: absolute;
> margin-left: 0px;
> margin-right: 100px;
> margin-top: 0px;
> height: 469px;
> width: 192px;
> background: #F8F400 url(images/homesidemenu.jpg) no-repeat left top;
> top: 93px;
> left: -1px;
> background-color: #E00032;
> }
> #topCut{
> margin-left: 190px;
> margin-right: 0px;
> margin-top: 0px;
> width: 555px;
> left: 0px;
> top:20px;
> height: 20px;
> background: #ffffff url(images/topcut.gif) no-repeat left top;
> }
> #mainContent{
> position: absolute;
> margin-left: 200px;
> margin-right: 200px;
> margin-top: 0px;
> width: 358px;
> left: 1px;
> top:117px;
> height: 316px;
> background-color:#FFFFFF
>
> }
> #flexibletxt {
> position:relative;
> font-family: Arial, Helvetica, sans-serif;
> font-size: 11px;
> font-weight: bold;
> color: #000000;
> margin-left: 50px;
> padding: 0px;
> word-spacing: normal;
> letter-spacing: normal;
> width: 300px;
> margin-top: 0px;
> margin-left: 50px;
> text-align:right;
> vertical-align:top;
> }
> img.top {vertical-align:text-top};
> #right{
> position: absolute;
> margin-left: 600px;
> margin-right: 200px;
> margin-top: 0px;
> width: 327px;
> left: -32px;
> top:118px;
> height: 475px;
> background-color:#FFFFFF
>
>

[csa]

I have started to amend this file but I have a few questions:

[url]http://www.thehertsweb.co.uk/css/031105.htm[/url]

How can I remove the white space which appears either in #topCut or
#mainContent? I have tried adjusting the margin-left but this doesn't seem to
make a difference, also this looks fine in IE but in MFF the #right text moves
slightly.

thanks