Re: [css-d] div ontop of a div ?
Hi Christopher, Before you even start to think about CSS, you need to understand some key HTML concepts, which aren't really relevant to this list. Try a search for HTML tutorial or similar. However, a few basic points: * In HTML, name represents an 'opening' tag and /name represents its matching 'closing' tag. Everything between those can be thought of as content that is classified according to those tags. So pa paragraph/p means 'the text a paragraph is a paragraph'. * Certain tags (or 'elements') can be nested, such as the div element you previously mentioned: div divsome text in here .../div /div Note that, reading through this excerpt in order, you get 'open tag', 'open tag', 'close tag', 'close tag'. The order of these represents the structure of your document. * Tabbing, spacing, etc. *broadly speaking* is irrelevant. There are certain cases where spacing is significant, but - generally speaking - all you need to know for now is that: 1. divsome text/div 2. div some text /div and 3. div some text/div are all interchangeable. Please feel free to mail me directly with any follow-up questions. I think this is off-topic, though, so we should call an end to this thread on the list for now. Cheers, - Bobby --- On Sun, 6/15/08, Christopher [EMAIL PROTECTED] wrote: From: Christopher [EMAIL PROTECTED] Subject: Re: [css-d] div ontop of a div ? To: css-d@lists.css-discuss.org Date: Sunday, June 15, 2008, 12:48 AM I decided to start from the beginning so I deleted all styles and started new and build from there, here is a background base div tag: http://www.walkfar.ca/main2.html Two problems it does not repeat along the X or the Y you see there is a border, second now if I nest a div within this div as a starting point I assume I tab below this main div as so div div to nest, correct? Gunlaug Sørtun wrote: Christopher wrote: So you are basically tricking the browser with CSS ? There's no tricks involved in CSS. It is all about achieving visual appearance by applying style-rules in accordance with standards, and thereby making browsers do their job in accordance with same standards so they (hopefully) recreate the visual appearance at the user-end. Sometimes we'll have to add workarounds for weak/old browsers that don't support particular parts of the standards. For example: IE/win is weak and doesn't support much of any standard, and its support is partly quite buggy. Making IE/win act as if it supports standards, _can_ be quite tricky at times. Cause I want to have a div nested but in different positions. Sure, that's rarely ever a problem - although it can be problematic in the sense that there's little or no room for mistakes. You can offset a div from its original position in a number of ways, each with its positive and negative effects. Combining offset-methods is also possible, and sometimes preferable. What will work for you depends on your exact case - complete layout and visual appearance, which I have no clear impression of at this point so can not suggest practical solution(s) for. regards Georg __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Anyone have a clue? IE body-padding bug?
Pete Holzmann wrote:
...
Reduced to the minimum at http://www.ds.org/test/iepieoverlay/
* On FF, you see a pink overlay across the whole page, with some text in
the middle.
* On IE6, the overlay is limited to part of the left side.
Clearly, IE6 pays attention to the body{} padding setting. ...
Hi Pete
For a percentage width, IE6 calculates the width of an absolutely
positioned box with respect to the content edge of its containing block.
Meanwhile, the spec says width:100% is calculated with respect to the
padding edge of the containing block.
Since body (the containing block in your example) has padding, there is
a difference.
For a workaround, I think the a.p. box should get the same padding of
200px in addition to the width:100%. Put this into a conditional comment
to exclude the normal browsers.
But your testpage runs in quirks mode (missing or incomplete doctype),
not in standards mode, so this fix does not have any effect due to the
old box model (in quirks mode, padding is always included in width:100% )
Is the final page running in standards mode or quirks mode? the
workaround depends on the rendering mode.
regards,
Ingo
--
http://www.satzansatz.de/css.html
http://www.dolphinsback.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Anyone have a clue? IE body-padding bug?
On 16 Jun 2008 Ingo Chao said... Hi Pete For a percentage width, IE6 calculates the width of an absolutely positioned box with respect to the content edge of its containing block. Meanwhile, the spec says width:100% is calculated with respect to the padding edge of the containing block. Wow. Not in most of the bug-lists, but now that you mention it, I have found one or two reverences. Looks like this is IE6 only, correct? Not before/after. Since body (the containing block in your example) has padding, there is a difference. For a workaround, I think the a.p. box should get the same padding of 200px in addition to the width:100%. Put this into a conditional comment to exclude the normal browsers. OK, I tried that and it works. I don't understand WHY it works, which is frustrating. The logical thing to me would be negative padding for the absolute positioned box, to make it bigger. but that doesn't work. Got a minute to explain this? (btw, the original link now has a link to the repaired version. so, http://www.ds.org/test/iepieoverlay But your testpage runs in quirks mode... Sorry, accidentally removed the doctype. It's there now. Thanks MUCH! Pete __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] div ontop of a div ?
In my example, I am wanting that to fit the browser window along the X
and the Y that background image.
Christopher
[EMAIL PROTECTED] wrote:
Send css-d mailing list submissions to
css-d@lists.css-discuss.org
To subscribe or unsubscribe via the World Wide Web, visit
http://lists.css-discuss.org/mailman/listinfo/css-d
or, via email, send a message with subject or body 'help' to
[EMAIL PROTECTED]
You can reach the person managing the list at
[EMAIL PROTECTED]
When replying, please edit your Subject line so it is more specific
than Re: Contents of css-d digest...
Today's Topics:
1. Re: div background issue (Mark Wheeler)
2. Re: div background issue (David Laakso)
3. div ontop of a div ? (Christopher)
4. Re: div ontop of a div ? (David Laakso)
5. Re: div ontop of a div ? (Gunlaug S?rtun)
6. Re: div ontop of a div ? (Christopher)
7. Re: div ontop of a div ? (Christopher)
8. Re: div ontop of a div ? (David Laakso)
9. pull out menu being overwritten by menu underneath
(Carol Swinehart)
10. Re: pull out menu being overwritten by menu underneath
(Bill Brown)
11. Re: div ontop of a div ? (Christopher)
12. Re: div ontop of a div ? (David Laakso)
13. Re: pull out menu being overwritten by menu underneath
(Holly Bergevin)
14. Re: div ontop of a div ? (Gunlaug S?rtun)
15. div within a div Phase2 (Christopher)
16. Re: div within a div Phase2 (Gunlaug S?rtun)
17. Re: div ontop of a div ? (Christopher)
18. IE6 css menu question (Shanna Korby)
19. Re: IE6 css menu question (Gunlaug S?rtun)
20. Anyone have a clue? IE body-padding bug? (Pete Holzmann)
21. Re: JQuery and td w/ display:none alignments (E McMahon)
22. Re: IE6 css menu question (Al Sparber)
23. Re: div ontop of a div ? (Bobby Jack)
24. Re: Anyone have a clue? IE body-padding bug? (Ingo Chao)
--
Message: 1
Date: Sat, 14 Jun 2008 08:09:21 -0700
From: Mark Wheeler [EMAIL PROTECTED]
Subject: Re: [css-d] div background issue
To: CSS Discuss css-d@lists.css-discuss.org
Message-ID: [EMAIL PROTECTED]
Content-Type: text/plain; charset=US-ASCII; delsp=yes;
format=flowed
On Jun 14, 2008, at 7:22 AM, Duane Nelson wrote:
Good morning, all.
I'm sure there is a simple fix to my issue, but I've done so many
different approaches displays, floats, positions, and margins that I
think I've utterly confused myself.
Link: http://alansonnazarene.org/index1.html
CSS: http://alansonnazarene.org/css/anaz.css
Issue Goal: To have a background-color: #e1dcc5 to fill entirely
#main which includes #content and #sidebar
Presently I'm floating #content to the right. This is where I
surrendered to the list. BTW, I know that a fixed width would be a
quick solution, but I need it to work with varying content.
I'm open to a fix but the best solution would be my preference.
Thanks for any help.
Duane Nelson
Hi Duane,
It looks like you need a little float clearing to make that happen.
Check out this SitePoint article:
http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats/
Notice the following links within the article:
http://www.positioniseverything.net/easyclearing.html
and
http://www.sitepoint.com/examples/clearing_floats/example2.php
The latter one I would try first. And I think that will solve your
problem. Just at the overflow: auto (or hidden works, too) and width:
100% to your #main div.
Mark
--
Message: 2
Date: Sat, 14 Jun 2008 11:37:49 -0400
From: David Laakso [EMAIL PROTECTED]
Subject: Re: [css-d] div background issue
To: Duane Nelson [EMAIL PROTECTED]
Cc: CSS Discuss css-d@lists.css-discuss.org
Message-ID: [EMAIL PROTECTED]
Content-Type: text/plain; charset=ISO-8859-1; format=flowed
Duane Nelson wrote:
I'm sure there is a simple fix to my issue, but I've done so many
different approaches displays, floats, positions, and margins that I
think I've utterly confused myself.
Link: http://alansonnazarene.org/index1.html
CSS: http://alansonnazarene.org/css/anaz.css
Duane Nelson
#main { overflow:hidden;/*add*/}
#nav {*height: 24px;delete*/ min-height: 24px; /*add*/} /* keep nav
from breaking w/font-scaling*/
* html #nav {height: 24px;} /*hack for IE/6*/
#content div {/*text-align: justify; delete to ditch the rivers*/}
Not freezing the fonts for your primary market (Internet Explorer) is
always a nice touch...
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Missing Dropdown Flyout menu
Can someone look at this site I just built and tell me why my last link in the header shows up in Saf/FF and IE6 but not IE7? http://www.gaycouplesgetmarried.com/ Is this a Wordpress issue? Thank you all, dear people! mc Melton Cartes An Ad Guy 106 Guerrero St. San Francisco, CA 94103 [EMAIL PROTECTED] 415-621-6501 http://www.anadguy.com ~ ~ ~ Are you learning Spanish? Do you know someone who is? The secret to learning Spanish in my new eBook, The Cartesian Spanish Pronunciation Lesson! http://www.cartesianspanishlesson.com ~ ~ ~ Want to see some T-shirts and other schwag I've designed? http://www.zazzle.com/anadguy ...there'll be more to come. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Missing Dropdown Flyout menu
Melton Cartes wrote: Can someone look at this site I just built and tell me why my last link in the header shows up in Saf/FF and IE6 but not IE7? http://www.gaycouplesgetmarried.com/ mc This line above the doctype, !-- B E G I N P A G E . P H P -- puts IE/7 in quirks. Delete it and close the gap after it is removed, and all should be well. All will not be well in any browser if anyone cares to scale the fonts. You may want to validate the CSS markup. -- http://chelseacreekstudio.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Email Virus
This is kinda off topic, but very important. I'm getting email viruses, and I think it's from this forum. An attachment is with every email I get. Of course, I haven't opened any of them. Anyone else with this problem. Anyone know how to stop this? Please do not remove this email, everyone needs to see it. Terri __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] ie6 - long border on two page, not on rest
I am totally perplexed. I have checked similar pages where there is no problem. but on two pages this problem exists: URL: http://www.phiferpavittwine.com On the index.htm and winetasting notes pages the line that separates the about and wine column with the mailing list and contact column is much longer that it should be. It is fine on all the other pages, hm. I am confused. On all other browers (mac) it is fine, just ie6 for windows. Please help. thanks. --s __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
