Re: [WSG] pos- relative or margin?
People use position:relative instead of margins to help avoid margin collapse. Here's some links in case you aren't familiar with margin collapse. http://www.w3.org/TR/CSS2/box.html#collapsing-margins http://www.andybudd.com/archives/2003/11/no_margin_for_error/ Michael Turnwall for all your web code needs turnwall.net Gunlaug Srtun wrote: Naveen Bhaskar wrote: I have seen a page where all the divs are positioned with position relative and with top , bottom attributes instead of margin.. Is this a good method? Depends entirely on the actual layout. I often use both relative offset and margin push/pull on the same elements. Position relative doesn't move the element, only offset it visually - the element still takes up space in its original, non-positioned, position. Margins affects the element's actual position. When used on floats margins can remove the element-space partly or entirely. There is no browser compatibility issues while using this where as when using margin properties IE has probelms. IE6 has serious problems with position relative in certain combinations, but provoking bugs with margins isn't a problem either in that old bugger. IE7 is better but far from flawless. IE7 and older introduce positioning and margin problems related to 'hasLayout'[1], where the cure for one bug often causes more problems than the disease. regards Georg [1]http://www.satzansatz.de/cssd/onhavinglayout.html ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: memberh...@webstandardsgroup.org***
Re: [WSG] Images Paragraph Width
What about a _javascript_
solution? Find the width of the image and give the paragraph tag a
width to match.
--
Michael
Turnwall
for all
your web code needs
turnwall.net
Aldona wrote:
Hi,
I have a problem which I feel like I should know but apparently don't.
:-)
I have an image which my CSS doesn't know (and will never know) the
size of. The image is in a paragraph with the class of 'img'.
p class="img"img src="" alt="pic"
/br /Regular
Image/p
What I want to do is put a border around the paragraph (not the image
so it goes around the text as well). What happens is the border winds
up the width of the whole page even though I have margin and padding
set to zero.
The CSS is:
p.img{
padding: 0.3em;
margin: 0em;
border: 2px solid red;
font-size: 0.9em;
}
How can I stop the border stretching the entire width of the page.
Unfortunately in this case float is not an option and I have a
limitation in that the HTML needs to remain as basic as possible. The
CSS can be as complicated as anything but the HTML needs to be simple.
Hopefully someone will have come across this problem before and be able
to point me in the right direction.
Thanks to all.
IceKat.
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] W3C Validation Question
Can you site any documentation that states theh opening HTML tag is optional? -- Michael Turnwall for all your web code needs turnwall.net David Dorward wrote: On Tue, 2008-08-26 at 10:02 -0400, Joseph Taylor wrote: Well for starters you're missing your opening html tag... ... which is optional. ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] W3C Validation Question
Nevermind, just looked it up myself. Optional in HTML but xHTML. -- Michael Turnwall for all your web code needs turnwall.net Michael Turnwall wrote: Can you site any documentation that states theh opening HTML tag is optional? -- Michael Turnwall for all your web code needs turnwall.net David Dorward wrote: On Tue, 2008-08-26 at 10:02 -0400, Joseph Taylor wrote: Well for starters you're missing your opening html tag... ... which is optional. ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] H1 and the img tag
You can just use text-indent to move the text off the screen and then put a background image into the H1 tag. -- Michael Turnwall for all your web code needs turnwall.net Schalk Neethling wrote: Hi there everyone, I was wondering. There is a general practice to use text replacement when it comes to company logo's on websites. If one does not want to use this practice, would there be any objection to wrapping the company logo image with an H1 one tag? I am thinking of this more in terms of the front page, on inner pages I would think the main topic of the page is the one that should be marked up with H1. What is your thoughts and would you recommend image replacement instead? Kind Regards, Schalk *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] Inline style works but css does not
If you are on a mac, Textmate is the best choice. -- Michael Turnwall for all your web code needs turnwall.net David Fuller - magickweb wrote: I agree with you there however I have been known (usually when im half dead from coding too long) to look @ a misplaced space or + or whatever, and wonder why it wont work ... Anyway meh its all good. Speaking of intelligent editors... What do you all prefer?? Myself I am a Dreamweaver fan... :) David Fuller Developer magickweb Web:http://www.magick.com.au Tel: 0434 728 267 Email: [EMAIL PROTECTED] -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]] On Behalf Of Hassan Schroeder Sent: Saturday, August 02, 2008 2:27 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Inline style works but css does not David Fuller - magickweb wrote: Come on everyone don't give Michael too hard a time, we ALL typo from time to time and wonder why it won't work... Its just part n parcel of the coding world... True enough, but when something "doesn't work" running it through a validator (or even an intelligent editor) will frequently identify the issue(s). Validate early, validate often :-) -- Michael Turnwall for all your web code needs turnwall.net ***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] an inline element (inside a block element) sibling of another block element
Julin Landerreche wrote:
Hi all,
Suppose:
div
pI deserve to be a block/p
aI don't deserve to be a block/a
/div
The "a" element has a block parent ("div") as element.
But it also has a sibling element ("p"), which is a block element.
*Would you say it's valid?*
I've been searching (not too much) but haven't find too much about this.
In this article [1], the author talks about *anonymous block boxes*:
"For elements containing a mix of block-level
elements and inline-level elements (or plain text), so-called
anonymous block boxes are generated so that the principal block box
then contains nothing but block boxes." [1]
An his example is:
div
A line of plain text.
pA paragraph./p
Another line of text.
/div
which is slightly different to the one I posted.
So, is it valid to mix inline and block elements (as siblings) as long
as the inline elements are children of a block element?
Thanks in advance and excuse my english.
Julin Landerreche
[1]:
http://www.autisticcuckoo.net/archive.php?id=2005/01/12/block-vs-inline-2
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
why not just wrap the paragraph around the
link as well? Though I think it should be perfectly valid to have both
inline elements and block elements as children of a div. For example,
what if I have an entire column of a page wrapped in a div, which is
common practice. Why would every child of that div have to be another
block element?
***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***
Re: [WSG] H1 font not set in IE
Nick Roper wrote: Hi, We are making some changes to an existing site for a client - basically converting to CSS as far as possible. I'd appreciate it if someone could take a look at this page: http://dev.logical.co.uk/castlewelding/final/gates_railings.php The font for the h1 should be Garamond - as it is for the menus at the left. However it refuses to render in FF/Windows - although it is fine on FF/Mac. The other weird thing is that FF/Windows renders Garamond for the menus but not the h1. I have stared at it until I can't see wood for trees any more. I even tried adding an inline style attribute into the H1 tag - but that didn't work either. Am I missing something startlingly obvious? Thanks, Nick PS - image replacement will be made more I'm seeing Garamond (bold/italic) in IE6. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] dfn and a: Which Order?
I agree that it should be adfntext/dfn/a since the text is actually a definition. --Michael Turnwall Mordechai Peller wrote: Semantically, which is better: dfna/a/dfn or adfn/dfn/a My thoughts are the latter, as the dfn is closer to the word or phrase to which it's referring. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
