[css-d] H1 tag use
Hi All, I've used the h1 tag for the text of my website's title. Would anyone else have used a different tag? Sincerely, Brian __ css-discuss [cs...@lists.css-discuss.org] 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] H1 tag use
Brian M. Curran wrote: Hi All, I've used the h1 tag for the text of my website's title. Would anyone else have used a different tag? Sincerely, Brian That is appropriate for the index. Whether it is appropriate for the inside pages depends on the content of those pages and who you ask. Since it is not a CSS question you might try the web design list l...@webdesign-l.com with a clickable link to your site in the post. Best, ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] 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] H1 tag use
Title as in Masthead ? If so, I would have said that h1 was exactly the right element to use (I am assuming that you didn't mean Title as in title). Philip Taylor Brian M. Curran wrote: Hi All, I've used theh1 tag for the text of my website's title. Would anyone else have used a different tag? Sincerely, Brian __ css-discuss [cs...@lists.css-discuss.org] 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 [cs...@lists.css-discuss.org] 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] Strange IE6 div width problem
Alan Chandler wrote: I am trying to create what should be a relatively straight forward 3 column fixed width layout with the first column on the right. ... I have encountered a problem with IE6 which I don't quite understand. The positioning of the 2nd and 3rd columns depends on which page I am on, and therefore, it appears from the content of the page. ... The relevant site is http://www.hartley-web.com/templates/caro/index.php I seem to have found the solution - although I have no idea why it works. I have added display:inline for IE6 in the floated column divs. This seems to fix the problem. PS. On a side note, the logo for the site is in an absolutely positioned div, and I can't get the pngfix software to work with this logo. It does on some of the other templates on this site where the logo is not in an absolutely positioned div so I am assuming that is the issue. This is still an issue. -- Alan Chandler http://www.chandlerfamily.org.uk __ css-discuss [cs...@lists.css-discuss.org] 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] understading ul li as menus - A 5 question quest.
well the a element is still inline (I was referring to that element in my answer above). Try setting to a to display: inline-block in that test case. I have change to display: inline-block; and, it worked as expected. The padding space on a elements was rendered on the viewport. However, if I recall correctly, this very nice property/value par, is not well supported cross-browser, that's why I try to avoid it. Still, and since I have a float applied, we can rely on display:block; only right? http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v5.html Question, assuming that all my previous assumptions were correct: Is it ok to change the nature of a inline element to block ? Silly question perhaps, it depends on our/user/layout requirements, but, I mean, should we use it with caution (ie. Using mostly with very specific selectors?) (I believe I have repeat the same silly question) :) Please reply if it makes any sense. property, I still can't see any effects on the vertical space augmentation: http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v4.html You apply the line-height to the a element. this won't affect the layout/height of the box which is governed by the line-box generated by the block element (LI in this case). Almost perfectly clear. Why the line-height doesn't affect the container? Or better (or worst) yet, what kind of rule, apply when the element affect the container or don't affect it? Apply to line-height to the parent block (like the UL or the LI). Ok, and if we do so, let me guess, we also need to change the border and background properties declarations from the A element to the LI, and some other necessary changes. :) Yes? http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v6.html So, I still have doubts here: but because it is an inline element, the excess padding will be clipped by the overflow:hidden. because it seems that, even if we remove the display:inline; property, the padding is still clipped,if we keep that overflow:hidden; declaration. As I explained above, your a element is an inline element. You had originally applied that display:inline to the parent li (iirc). In the testcases above, you float the li, but you apply the padding to the a. And since the A is a inline element by default, with or without overflow, I will get no margin or padding bottom/up here. So, actually, the relation I was assuming between inline and overflow, doesn't exist or, better saying, doesn't exist on the way I was describing? Correct? I rarely use overflow:hidden for these kind of constructs. If the intent is to contain the floated blocks for 'good' browsers, there are many ways. Now that bugs me. Until know, I thought that, for compliant browsers, the only condition that should apply for floats to be contained was that the container should be wide enough to contain the child floated elements. And, perhaps for consistency cross browser, explicitly declare a width on both, container an elements.(don't recall if this is for IE only). Google 'containing floats'. if your use of 'overflow:hidden' is solely and only to trigger 'hasLayout' for IE 6 7, you could use 'zoom:1;' Yes but, in order to use it, and as far as I know, to have it validate, we need to create a separate css file on a conditional comment for ie browsers only. Clearly, this will be done but, let's say that we have 140 elements to contain the floats. Should we declare all those elements again on a separate css file (assuming this is the best approach), and apply zoom:1; to each of them? Philippe --- Philippe Wittenbergh http://l-c-n.com/ Thank you sooo much. K. Regards, Márcio __ css-discuss [cs...@lists.css-discuss.org] 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] H1 tag use
Brian M. Curran wrote: Hi All, I've used theh1 tag for the text of my website's title. Would anyone else have used a different tag? Sincerely, Brian Title as in Masthead ? If so, I would have said that h1 was exactly the right element to use (I am assuming that you didn't mean Title as in title). Philip Taylor I should have been more clear. On my site www.draftingservices.com , every page has the title: DraftingServices.com Drafting services on tap. I've used a h1 tag and styled the tag to get the effect that I want. I'm concerned that Google may think my choice of tag is spammy, since they give SEO weight to h tags. This question came to mind because I actually just read an article here: http://searchenginewatch.com/3639724 . I love how CSS and SEO go so well together, and even though this was not a pure CSS question, I figured I'd try to squeak it onto the list. I actually didn't choose the h1 tag for SEO benefit, but rather because someone pointed out that I was using a p tag for it incorrectly. Perhaps I could further refine my choice of tag?? Brian __ css-discuss [cs...@lists.css-discuss.org] 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] Strange IE6 div width problem
I am trying to create what should be a relatively straight forward 3 column fixed width layout with the first column on the right. I use some of the technique from In search of the Holy Grail, in that I float each of the columns left, use the padding to hold the first column where I want it, and then pull the other divs in position with a negative left margin. I am presuming that this technique is pulling the second and third columns to the left relative to the right edge of the first column It appears that what you want is to display the 3 DIVs in a reverse order, so why not simply floating all of them to the right? You usually get better results across browsers by keeping things *simple*. -- Regards, Thierry www.tjkdesign.com | articles and tutorials www.ez-css.org | ultra light CSS framework __ css-discuss [cs...@lists.css-discuss.org] 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] H1 tag use
I should have been more clear. On my site www.draftingservices.com , every page has the title: DraftingServices.com Drafting services on tap. I've used a h1 tag and styled the tag to get the effect that I want. I'm concerned that Google may think my choice of tag is spammy, since they give SEO weight to h tags. This question came to mind because I actually just read an article here: http://searchenginewatch.com/3639724 . I love how CSS and SEO go so well together, and even though this was not a pure CSS question, I figured I'd try to squeak it onto the list. I actually didn't choose the h1 tag for SEO benefit, but rather because someone pointed out that I was using a p tag for it incorrectly. Perhaps I could further refine my choice of tag?? Brian Hello Brian, You have at least two answers on your plate, neither of them declare that it's a bad thing to use the h1 element. But this subject is not consensual. You may search for whatever feats you better on the list pointed in previous posts, because the link you have provided, is still more related with xhtml and seo question, then css and seo ones. ;) Regards, newbie, Márcio __ css-discuss [cs...@lists.css-discuss.org] 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] Strange IE6 div width problem
On 3/13/10 8:05 AM, Alan Chandler wrote: ... I have encountered a problem with IE6 which I don't quite understand. The positioning of the 2nd and 3rd columns depends on which page I am on, and therefore, it appears from the content of the page. ... The relevant site is http://www.hartley-web.com/templates/caro/index.php I seem to have found the solution - although I have no idea why it works. I have added display:inline for IE6 in the floated column divs. This seems to fix the problem. Yes. That's a fix for the bug that causes IE 6 to double float-side margins - right margins on right float; left margins on left floats. I don't think anyone knows why it works, except that it is IE. :-\ display: inline; is nonsense of course, and real browsers simply ignore it. Some people recommend adding that to every float, even if it is not a problem today, as you might add a margin later. YMMV. I also see that you are attempting full height columns. Be aware that there are potential problems with that method, in both new and older browsers. You may like to check out the companion columns method[1]. In particular, look at the first example[2]. This not only has full height columns, but employs a newer holy grail technique that uses relative positioning on the floats, thus avoiding several browser bugs, including the doubled margins. PS. On a side note, the logo for the site is in an absolutely positioned div, and I can't get the pngfix software to work with this logo. It does on some of the other templates on this site where the logo is not in an absolutely positioned div so I am assuming that is the issue. This is still an issue. Scripts usually use the AlphaImageLoader filter[3] to apply PNG transparency. For this to work, the element needs layout. An absolutely positioned element does have layout[4], so it should work. FWIW I apply the MS filter directly to my CSS, as I have yet to find a script that works reliably. Using the filter means using a background image instead of inline, but it does allow you to position and/or repeat the background, and works when scripts are blocked or disabled. [1] http://www.satzansatz.de/cssd/companions.html [2] http://www.satzansatz.de/cssd/companions/percpercpercfsa.html [3] http://msdn.microsoft.com/en-us/library/ms532969(VS.85).aspx [4] http://www.satzansatz.de/cssd/onhavinglayout.html#prop Cordially, David -- __ css-discuss [cs...@lists.css-discuss.org] 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] Strange IE6 div width problem
The relevant site is http://www.hartley- web.com/templates/caro/index.php PS. On a side note, the logo for the site is in an absolutely positioned div, and I can't get the pngfix software to work with this logo. It does on some of the other templates on this site where the logo is not in an absolutely positioned div so I am assuming that is the issue. In case you want to avoid that HTTP request: http://tjkdesign.com/articles/png-alpha-transparency_with-no-http-request.as p -- Regards, Thierry www.tjkdesign.com | articles and tutorials www.ez-css.org | ultra light CSS framework __ css-discuss [cs...@lists.css-discuss.org] 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] Image text box
Hi All, I've never done this before... I made a bordered text box around an image using a paragraph. It can be found here: http://www.draftingservices.com/building_survey.html Would this be considered acceptable CSS or make-shift? Sincerely, Brian __ css-discuss [cs...@lists.css-discuss.org] 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] Image text box
Brian M. Curran wrote:
Hi All,
I've never done this before... I made a bordered text box around an image
using a paragraph. It can be found here:
http://www.draftingservices.com/building_survey.html
Would this be considered acceptable CSS or make-shift?
Sincerely,
Brian
It seems to work the way you have it cross-browder. Not sure why you
need such very long selector names, though.
This explains another method for achieving what you're after.
http://css.maxdesign.com.au/floatutorial/tutorial0204.htm
Either way, you may want to add this to keep the text and image within
their own block:
h5 {border: 1px solid red; clear:both; }
Best,
~d
--
desktop
http://chelseacreekstudio.com/
mobile
http://chelseacreekstudio.mobi/
__
css-discuss [cs...@lists.css-discuss.org]
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/
