Re: [css-d] How to get rid of gaps
On 9/1/05, Mark Lundquist <[EMAIL PROTECTED]> wrote: > > On Sep 1, 2005, at 11:34 AM, Peter Speltz wrote: > > > If anyone cares to reply: Is using id just a > > matter of protection for the developer by limiting them or is there > > more to it than that? > > It makes a difference at the JavaScript DOM level. And there are maybe > other differences that I don't know about. > > But, perhaps most importantly I think, it serves to communicate > _intent_, e.g. to a future maintainer of the CSS (and remember, that > future maintainer might be you a few months down the road, when the > details are no longer fresh in your mind!), or to someone else, e.g. > who's helping you. > > cheers, > ml Ahh, yes. Intent. That is the word i was looking for rather than *limit*. As a programmer , i fully appreciate code that demonstrates how it is intended to be used. Thanks all and i will check out the wiki when i get a chance. -- pjs __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Peter Speltz wrote:
If anyone cares to reply: Is using id just a
matter of protection for the developer by limiting them or is there
more to it than that?
NEVER limit the developer.
there is a time for a class
and a time for an id.
such as:
.menuitem { color: #fff; }
#menuholder { border: 1px solid #000; }
Link1
Link2
there is much more in the css-discuss wiki.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
On Sep 1, 2005, at 11:34 AM, Peter Speltz wrote: If anyone cares to reply: Is using id just a matter of protection for the developer by limiting them or is there more to it than that? It makes a difference at the JavaScript DOM level. And there are maybe other differences that I don't know about. But, perhaps most importantly I think, it serves to communicate _intent_, e.g. to a future maintainer of the CSS (and remember, that future maintainer might be you a few months down the road, when the details are no longer fresh in your mind!), or to someone else, e.g. who's helping you. cheers, —ml— __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
On 9/1/05, Mark Lundquist <[EMAIL PROTECTED]> wrote:
>
> On Aug 31, 2005, at 9:51 PM, Thierry Koblentz wrote:
>
> > Peter gave you the answer for the extra space already, but I'd like to
> > add
> > that you do not really need class="logo" in the markup because you can
> > get
> > to the images through:
> > .logobar img {}
>
> ...and, unless there are more than one "logobar" on a page, it should
> have id="logobar" instead of class="logobar"...
> ml
>
>
Wow! This list rocks. I will look up the differnces of id and class.
The only difference i know of is you can have only one instance of
any given id on a page. If anyone cares to reply: Is using id just a
matter of protection for the developer by limiting them or is there
more to it than that?
cheers,
--
pjs
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
On Aug 31, 2005, at 9:51 PM, Thierry Koblentz wrote:
Peter gave you the answer for the extra space already, but I'd like to
add
that you do not really need class="logo" in the markup because you can
get
to the images through:
.logobar img {}
...and, unless there are more than one "logobar" on a page, it should
have id="logobar" instead of class="logobar"...
—ml—
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Thank you both. Indeed whitespace in the markup was the problem.
Firefox did not recognize multiple src attributes or my doc is missing
some header info. s that an XHTML spec or HTML or ??? However
eliminating the whitespace between the img tags did the trick.
Also Thierry, i used your suggestion and went with the descendent
selector for the images. Less typing is good. Thank you for pointing
that out.
Cheers,
Peter
On 8/31/05, Thierry Koblentz <[EMAIL PROTECTED]> wrote:
> Peter Speltz wrote:
> > Hi all. I'm having a similar problem. I'm using Firefox on a PC for
> > starters. Despite 0margins, 0 padding,I have gaps that i do not
> > understand between images that make up my banner. I've been reading
>
> > img.logo {
> > border: none;
> > margin:0px ;
> > padding: 0px;
> > /*float: left; fixes it in Firefox PC */
> > }
>
>
> Peter gave you the answer for the extra space already, but I'd like to add
> that you do not really need class="logo" in the markup because you can get
> to the images through:
> .logobar img {}
> instead of:
> img.logo {}
>
> HTH,
> Thierry | www.TJKDesign.com
>
>
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Peter Speltz wrote:
> Hi all. I'm having a similar problem. I'm using Firefox on a PC for
> starters. Despite 0margins, 0 padding,I have gaps that i do not
> understand between images that make up my banner. I've been reading
> img.logo {
> border: none;
> margin:0px ;
> padding: 0px;
> /*float: left; fixes it in Firefox PC */
> }
Peter gave you the answer for the extra space already, but I'd like to add
that you do not really need class="logo" in the markup because you can get
to the images through:
.logobar img {}
instead of:
img.logo {}
HTH,
Thierry | www.TJKDesign.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
RE: [css-d] How to get rid of gaps
> From: Peter Speltz > > ...Firefox on a PC... > I have gaps that i do not understand between images that make up my banner. > > > > > > Peter, Whitespace in your markup is the culprit. Try something like: -- Peter Williams __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Hi all. I'm having a similar problem. I'm using Firefox on a PC for
starters. Despite 0margins, 0 padding,I have gaps that i do not
understand between images that make up my banner. I've been reading
CSS , The definitive guide for several weeks and from what i can tell,
if margin is 0, there should not be space with background showing
through between inline elements. Is that right?If i float them
it looks as it should in Firefox however my new Opera browser :)
insists on gaps either way.Am I missing something?
Confused,
Pjs
P.S. Here is the style used for all three images:
img.logo {
border: none;
margin:0px ;
padding: 0px;
/*float: left; fixes it in Firefox PC */
}
div.logobar {
width: 800px;
height: 84px;
padding: 0;
margin:0px auto;
}
Here is the markup:
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
David Laakso wrote: Diane Porter wrote: In the page I'm working on, http://www.aranyani.org/8-13A.html, in Safari and Firefox, gaps appear between the banner picture and the content below. I found a suggestion in the css-discuss archives to style the image and mark it display: block. I did that, and the effect is that now in IE the image disappears entirely. In the other two browsers the gap persists. Another problem that I suspect has the same root: in the left (blue) column, the image that forms the heading does not fit tightly against the top of the column. Neither of these problems is apparent in my editor, but they both show up in all the browsers I try. I'm sure this is a very kindergarten question, and I apologize for bothering you with it, but I'm stumped. Diane Porter Diane, Changing the markup may resolve the problems: Whoops: In other words delete the enclosing the first image; and the enclosing the second image. height="53" /> You did not ask about other considerations than your immediate situation, so I did not respond accordingly.. Regards, David Laakso -- David Laakso http://www.dlaakso.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Diane Porter wrote: In the page I'm working on, http://www.aranyani.org/8-13A.html, in Safari and Firefox, gaps appear between the banner picture and the content below. I found a suggestion in the css-discuss archives to style the image and mark it display: block. I did that, and the effect is that now in IE the image disappears entirely. In the other two browsers the gap persists. Another problem that I suspect has the same root: in the left (blue) column, the image that forms the heading does not fit tightly against the top of the column. Neither of these problems is apparent in my editor, but they both show up in all the browsers I try. I'm sure this is a very kindergarten question, and I apologize for bothering you with it, but I'm stumped. Diane Porter Diane, Changing the markup may resolve the problems: height="53" /> You did not ask about other considerations than your immediate situation, so I did not respond accordingly.. Regards, David Laakso -- David Laakso http://www.dlaakso.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How to get rid of gaps
Diane Porter wrote: http://www.aranyani.org/8-13A.html, in Safari and Firefox, gaps appear between the banner picture and the content below. That's the default margins on the you've wrapped the image in. Similar default is creating gaps around the image inside . Start out with 'margin: 0;' on the and , and the gaps will disappear. You may also simply delete the and , as those images don't need wrappers in that page. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] How to get rid of gaps
This is the first time I have posted. I am pretty new at css. In the page I'm working on, http://www.aranyani.org/8-13A.html, in Safari and Firefox, gaps appear between the banner picture and the content below. I found a suggestion in the css-discuss archives to style the image and mark it display: block. I did that, and the effect is that now in IE the image disappears entirely. In the other two browsers the gap persists. Another problem that I suspect has the same root: in the left (blue) column, the image that forms the heading does not fit tightly against the top of the column. Neither of these problems is apparent in my editor, but they both show up in all the browsers I try. I'm sure this is a very kindergarten question, and I apologize for bothering you with it, but I'm stumped. Thank you, Diane Porter [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
