Connecting Tech Pros Worldwide Forums | Help | Site Map

Margin and Padding Properties

Toronto Web Designer
Guest
 
Posts: n/a
#1: Jul 21 '05
I'm having trouble with the padding and margin properties. IE tends to be
happier with the padding and Netscape with the margin property.

So I tried this:

<link href="netscape-styles.css" rel="stylesheet" type="text/css">

<style type="text/css">
@import url(ie-styles.css);
</style>

But it doesn't work. It actually makes both browsers display things the
same but it's still wrong. Any thoughts?



Roderik
Guest
 
Posts: n/a
#2: Jul 21 '05

re: Margin and Padding Properties


Toronto Web Designer wrote:[color=blue]
> I'm having trouble with the padding and margin properties. IE tends to be
> happier with the padding and Netscape with the margin property.
>
> So I tried this:
>
> <link href="netscape-styles.css" rel="stylesheet" type="text/css">
>
> <style type="text/css">
> @import url(ie-styles.css);
> </style>
>
> But it doesn't work. It actually makes both browsers display things the
> same but it's still wrong. Any thoughts?
>
>[/color]
@import works in both browsers. Only NN4 (but that is an old one, won't
import this). You'd better post your page with the question concerning
the padding/margin in case of using such a work around.

--
http://www.archytas.nl/
webdesign, internet applicaties, internetgestuurde elektronica
Steve Pugh
Guest
 
Posts: n/a
#3: Jul 21 '05

re: Margin and Padding Properties


"Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:
[color=blue]
>I'm having trouble with the padding and margin properties. IE tends to be
>happier with the padding and Netscape with the margin property.[/color]

Which versions of IE and Netscape? What are your exact problems?
[color=blue]
>So I tried this:
>
><link href="netscape-styles.css" rel="stylesheet" type="text/css">
>
><style type="text/css">
>@import url(ie-styles.css);
></style>
>
>But it doesn't work.[/color]

You mean the browsers don't use _both_ stylesheets?
That's the only definition of 'works' that can be given to the above
code snippet.

Some older browsers (Netscape 4.x for example) don't understand
@import so using the above syntax hides the second style sheet from
those browsers. But all modern browsers will apply both stylesheets.
So if you want to over ride the first one you need to include explicit
styles in the second that over ride styles in the first.
[color=blue]
>It actually makes both browsers display things the
>same but it's still wrong. Any thoughts?[/color]

Explain what the actual problem is and post a URL.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
Toronto Web Designer
Guest
 
Posts: n/a
#4: Jul 21 '05

re: Margin and Padding Properties


Alo,

"Roderik" <mail@roderik.net> wrote in message
news:40f89713$0$62387$5fc3050@dreader2.news.tiscal i.nl...
(snip)[color=blue]
>You'd better post your page with the question concerning the[/color]
padding/margin in case of using such a work around.

Sample 2 is the intended presentation format but doesn't look good in
Netscape.
http://www.geocities.com/torontowebdesigner/sample2.htm without @import

This page is not as intended in both Netscape of IE
http://www.geocities.com/torontowebdesigner/ with @import

The main problem is indents: the ol element and the third end note is
indented to the right.

The CSS validates. The HTML doesn't. If it has to do with the HTML then I
want to know about it but if it doesn't, I already know that the HTML isn't
valid on these pages.


Toronto Web Designer
Guest
 
Posts: n/a
#5: Jul 21 '05

re: Margin and Padding Properties


Hi Steve,

"Steve Pugh" <steve@pugh.net> wrote in message
news:u39if0h7n7uvtrkrfoj03plf88520uhk8i@4ax.com...[color=blue]
> "Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:
>[color=green]
> >I'm having trouble with the padding and margin properties. IE tends to be
> >happier with the padding and Netscape with the margin property.[/color]
>
> Which versions of IE and Netscape? What are your exact problems?[/color]

IE 6 and Netscape 7. The URL and problems are listed under Roderik's
query... within the thread.


Roderik
Guest
 
Posts: n/a
#6: Jul 21 '05

re: Margin and Padding Properties


Toronto Web Designer wrote:[color=blue]
> Alo,
>
> "Roderik" <mail@roderik.net> wrote in message
> news:40f89713$0$62387$5fc3050@dreader2.news.tiscal i.nl...
> (snip)
>[color=green]
>>You'd better post your page with the question concerning the[/color]
>
> padding/margin in case of using such a work around.
>
> Sample 2 is the intended presentation format but doesn't look good in
> Netscape.
> http://www.geocities.com/torontowebdesigner/sample2.htm without @import
>
> This page is not as intended in both Netscape of IE
> http://www.geocities.com/torontowebdesigner/ with @import
>
> The main problem is indents: the ol element and the third end note is
> indented to the right.
>
> The CSS validates. The HTML doesn't. If it has to do with the HTML then I
> want to know about it but if it doesn't, I already know that the HTML isn't
> valid on these pages.
>
>[/color]
Well, the geocities generated html is crap, but when I put it without
geocities stuff on my host it gives the same result. At least the second
listitem on the bottom is really weird. Maybe you should try to apply
the padding of the ol to the listitems. The @import statement is only
invisible for nn4 so most netscape users will get the same styles served
as ie users.

--
http://www.archytas.nl/
webdesign, internet applicaties, internetgestuurde elektronica
Steve Pugh
Guest
 
Posts: n/a
#7: Jul 21 '05

re: Margin and Padding Properties


"Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:[color=blue]
>"Steve Pugh" <steve@pugh.net> wrote:[color=green]
>> "Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:
>>[color=darkred]
>> >I'm having trouble with the padding and margin properties. IE tends to be
>> >happier with the padding and Netscape with the margin property.[/color]
>>
>> Which versions of IE and Netscape? What are your exact problems?[/color]
>
>IE 6 and Netscape 7. The URL and problems are listed under Roderik's
>query... within the thread.[/color]

Are you and Roderik the same person? I'm very confused, which one of
you is having the problem? As far as I could see your post was
starting a new thread - no In-Reply-To header on your post.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
Steve Pugh
Guest
 
Posts: n/a
#8: Jul 21 '05

re: Margin and Padding Properties


"Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:[color=blue]
>"Steve Pugh" <steve@pugh.net> wrote:[color=green]
>> "Toronto Web Designer" <torontowebdesigner@yahoo.ca.invalid> wrote:
>>[color=darkred]
>> >I'm having trouble with the padding and margin properties. IE tends to be
>> >happier with the padding and Netscape with the margin property.[/color]
>>
>> Which versions of IE and Netscape? What are your exact problems?[/color]
>
>IE 6 and Netscape 7. The URL and problems are listed under Roderik's
>query... within the thread.[/color]

I hope my other message got cencelled quickly enough - my brain's not
quite working yet.

Your problem is with lists - different browsers set the margins and
padding on lists in different ways. So you need to set all four
properties explicitly. In youe case you want the numbers to align with
the edge of the paragraphs.
ol {margin-left: 10%; padding-left: 0;}
li {margin-left: 1.3em; padding-left: 0;}
That should get the same alignment (within a few pixels) in all modern
browsrs.

No need to muck about trying to feed different stylesheets to
different browsers.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
Brian
Guest
 
Posts: n/a
#9: Jul 21 '05

re: Margin and Padding Properties


Toronto Web Designer wrote:

[color=blue]
> padding/margin in case of using such a work around.
>
> Sample 2 is the intended presentation format but doesn't look good
> in Netscape.[/color]
[color=blue]
> http://www.geocities.com/torontowebdesigner/sample2.htm without
> @import
>
> The CSS validates. The HTML doesn't. If it has to do with the
> HTML then I want to know about it[/color]

There's no way to know if the HTML is causing the problem or not until
you fix it. That is always the first step. CSS is optional. HTML is
the core of your page.
[color=blue]
> I already know that the HTML isn't valid on these pages.[/color]

If you knew that, you should have fixed it before asking here.
Validate, then come back if you're still having problems.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Roderik
Guest
 
Posts: n/a
#10: Jul 21 '05

re: Margin and Padding Properties


Brian wrote:[color=blue]
> Toronto Web Designer wrote:
>
>[color=green]
>> padding/margin in case of using such a work around.
>>
>> Sample 2 is the intended presentation format but doesn't look good
>> in Netscape.[/color]
>
>[color=green]
>> http://www.geocities.com/torontowebdesigner/sample2.htm without
>> @import
>>
>> The CSS validates. The HTML doesn't. If it has to do with the
>> HTML then I want to know about it[/color]
>
>
> There's no way to know if the HTML is causing the problem or not until
> you fix it. That is always the first step. CSS is optional. HTML is
> the core of your page.
>[color=green]
>> I already know that the HTML isn't valid on these pages.[/color]
>
>
> If you knew that, you should have fixed it before asking here.
> Validate, then come back if you're still having problems.
>[/color]
I fixed the HTML for him. He can't do it himself at geocities because
geocities servers add invalid html to your pages when serving them.
You can find it here: http://www.top100nederland.net/test/geocities.htm
But strange things happen to the listitems on his page when styling them
(for example see the bottom of the page in Mozilla).

--
http://www.archytas.nl/
webdesign, internet applicaties, internetgestuurde elektronica
Andrew Thompson
Guest
 
Posts: n/a
#11: Jul 21 '05

re: Margin and Padding Properties


On Tue, 20 Jul 2004 19:56:16 +0200, Roderik wrote:
<T.W.D.>[color=blue][color=green][color=darkred]
>>> http://www.geocities.com/torontowebdesigner/sample2.htm[/color][/color][/color]
...
<Brian>[color=blue][color=green]
>> There's no way to know if the HTML is causing the problem or not until
>> you fix it.[/color][/color]
...[color=blue]
> I fixed the HTML for him. He can't do it himself at geocities because
> geocities servers add invalid html to your pages when serving them.[/color]

Yes, Grrr.. I used to recommend that folks put
their pages up at GeoCities to test and debug,
but this mangling of valid HTML by GeoCities
makes *that* all but useless! :-(

Does anyone know of a free host who can manage
to insert their ads *without* destroying the HTML,
or a way of inserting the ads in GC pages that *is*
valid? [ When I used to have a GeoCities site
you could put the ads in your page yourself, so
planning the entire HTML, but that seems not the
case these days.. ]

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Brian
Guest
 
Posts: n/a
#12: Jul 21 '05

re: Margin and Padding Properties


Roderik wrote:
[color=blue]
> Brian wrote:
>[color=green]
>> Toronto Web Designer wrote:
>>[color=darkred]
>>> I already know that the HTML isn't valid on these pages.[/color]
>>
>> If you knew that, you should have fixed it before asking here.
>> Validate, then come back if you're still having problems.
>>[/color]
> I fixed the HTML for him. He can't do it himself at geocities because
> geocities servers add invalid html to your pages when serving them.[/color]

So I now see. Apologies to the op.

Aside: My gosh, that's a lot of crud. What is with the string of
closed tags? To protect from a page with an element not closed by the
author?

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Matt
Guest
 
Posts: n/a
#13: Jul 21 '05

re: Margin and Padding Properties


Andrew Thompson wrote:
[color=blue]
> Does anyone know of a free host who can manage
> to insert their ads *without* destroying the HTML,
> or a way of inserting the ads in GC pages that *is*
> valid? [ When I used to have a GeoCities site
> you could put the ads in your page yourself, so
> planning the entire HTML, but that seems not the
> case these days.. ][/color]

Freewebs are good, if you don't need PHP etc.
<http://www.freewebs.com/>

For one thing, they leave it to you to insert the ad!

--
Matt


-----= Posted via Newsfeeds.Com, Uncensored Usenet News =-----
http://www.newsfeeds.com - The #1 Newsgroup Service in the World!
-----== Over 100,000 Newsgroups - 19 Different Servers! =-----
Steve Pugh
Guest
 
Posts: n/a
#14: Jul 21 '05

re: Margin and Padding Properties


Brian <usenet3@julietremblay.com.invalid> wrote:[color=blue]
>Roderik wrote:[color=green]
>>
>> I fixed the HTML for him. He can't do it himself at geocities because
>> geocities servers add invalid html to your pages when serving them.[/color]
>
>So I now see. Apologies to the op.
>
>Aside: My gosh, that's a lot of crud. What is with the string of
>closed tags? To protect from a page with an element not closed by the
>author?[/color]

Once upon a time authors could kill the JavaScript that Geocities
stuffs at the end of the file by leaving certain elements open at the
end of their page. Geocities "fixed" this by closing all those
elements. Not by parsing the page and closing anything left open, but
by always shoving in a bunch of end tags - the sledgehammer approach.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>
Brian
Guest
 
Posts: n/a
#15: Jul 21 '05

re: Margin and Padding Properties


Steve Pugh wrote:
[color=blue]
> Once upon a time authors could kill the JavaScript that Geocities
> stuffs at the end of the file by leaving certain elements open at
> the end of their page. Geocities "fixed" this by closing all those
> elements. Not by parsing the page and closing anything left open,
> but by always shoving in a bunch of end tags - the sledgehammer
> approach.[/color]

If all you have is a hammer...

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Andrew Thompson
Guest
 
Posts: n/a
#16: Jul 21 '05

re: Margin and Padding Properties


On Tue, 20 Jul 2004 21:47:09 +0100, Matt wrote:
[color=blue]
> Freewebs are good, if you don't need PHP etc.[/color]

You have to pay for PHP at GeoCities AFAIU..
It does not seem to be included with the
free sites.
[color=blue]
> <http://www.freewebs.com/>
>
> For one thing, they leave it to you to insert the ad![/color]

Great, thanks for the tip.
I'll check them out.. :-)

It will be interesting to see if it
is possible to get a page up there,
*with* their ad included, that validates..

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Andrew Thompson
Guest
 
Posts: n/a
#17: Jul 21 '05

re: Margin and Padding Properties


On Tue, 20 Jul 2004 16:33:31 -0400, Brian wrote:
[color=blue]
> geocities servers add invalid html to your pages[/color]
...[color=blue]
> Aside: My gosh, that's a lot of crud[/color]

It seems you are unconvinced just how bad
this mangling is.. I will not reference
the current page, I'll refer to one I know
better, a page I wrote for a friend and uploaded
to GeoCities..

<http://www.geocities.com/flaredlens/files/index.html>
His business ..does not have any, ..well business
yet, so he chose the 'free' site.

I checked the HTML before I uploaded it, here
is a copy of the HTML (with CSS) at my own site..
<http://www.physci.org/test/fl/>

The page validates just fine at my site..
<http://validator.w3.org/check?uri=http://www.physci.org/test/fl/>

Ok, OK '4.01 Transitional'.. pretty low
validation standard, but it *does* validate..

Whereas here is what the validator
thinks of the GeoCities version..
<http://validator.w3.org/check?uri=http://www.geocities.com/flaredlens/files/index.html>

...and very oddly at this instant the validator
is reporting *that* as entirely valid XHTML 1.0
strict, whereas moments ago it was reporting
21 validation errors as 4.01 Transitional...

I mean, look at the page, there is no 'rocket
science' positioning, no complex structure,
no nested tables, ..no tables at all in fact.
And yet the GeoCities server manages to insert
21 errors (and an ad) into the document before
it reaches the user. :-/

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Brian
Guest
 
Posts: n/a
#18: Jul 21 '05

re: Margin and Padding Properties


First: you snipped an attribution; please don't do that. I've
reinserted it where it belongs.


Andrew Thompson wrote:
[color=blue]
> Brian wrote:[/color]

[reinserted] Roderik wrote:[color=blue][color=green]
>> geocities servers add invalid html to your pages[/color]
>[color=green]
>> Aside: My gosh, that's a lot of crud[/color]
>
> It seems you are unconvinced just how bad this mangling is..[/color]

Huh? How did you reach that conclusion? "My gosh, that's a lot of
crud" means, well, my gosh, that's a lot of crud. Geocities add stuff
to the page that is really awful. How did you read that as anything else?

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Andrew Thompson
Guest
 
Posts: n/a
#19: Jul 21 '05

re: Margin and Padding Properties


On Tue, 20 Jul 2004 18:07:46 -0400, Brian wrote:[color=blue]
> First: you snipped an attribution; please don't do that. I've
> reinserted it where it belongs.
> Andrew Thompson wrote:
>[color=green]
>> Brian wrote:[/color]
>
> [reinserted] Roderik wrote:[color=green][color=darkred]
>>> geocities servers add invalid html to your pages[/color]
>>[color=darkred]
>>> Aside: My gosh, that's a lot of crud[/color]
>>
>> It seems you are unconvinced just how bad this mangling is..[/color]
>
> Huh? How did you reach that conclusion? "My gosh, that's a lot of
> crud" means, well, my gosh, that's a lot of crud. Geocities add stuff
> to the page that is really awful. How did you read that as anything else?[/color]

By mistake. You have my apologies.

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Closed Thread


Similar HTML / CSS bytes