[WSG] paragraph indent
I wanted to get my paragraphs to indent on a site so I tried the most
intuitive thing:
p:first-line{padding:1em}
It did nothing. I tested a couple other things to make sure I was doing
the right thing, but it appears that I can only change the font values.
Then I tried this:
p:before{float:left;width:1em;height:1em;}
didn't work either. I toyed around with it a bit and it looks like
float:left doesn't work on :before stuff.
So finally I tried this:
p:before{content:'mmm';visibility:hidden;}
and it works as expected. This is something of a hack, but as far as I
know, it should work on all CSS2 browsers. Any better suggestions on how
to do this?
Alan Trick
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] paragraph indent
G'day
I wanted to get my paragraphs to indent on a site so I tried the most
intuitive thing:
p:first-line{padding:1em}
How about
p { text-indent: 1em }
Regards
--
Bert Doorn, Better Web Design
http://www.betterwebdesign.com.au/
Fast-loading, user-friendly websites
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
RE: [WSG] paragraph indent
Bert,
I wanted to get my paragraphs to indent on a site so I tried the most
intuitive thing:
p:first-line{padding:1em}
How about
p { text-indent: 1em }
This will indent the whole paragraph, while Alan is only trying to indent
the first line.
Thanks,
Tatham Oddie
Fuel Advance - Ignite Your Idea
www.fueladvance.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] paragraph indent
Tatham Oddie napisał(a):
How about
p { text-indent: 1em }
This will indent the whole paragraph, while Alan is only trying to indent
the first line.
According to the spec
(http://www.w3.org/TR/REC-CSS2/text.html#indentation-prop) it indents
only the first line:
This property specifies the indentation of the first line of text in a
block.
So, the answer was and is correct.
--
Łukasz Grabuń, http://www.grabun.com/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] paragraph indent
G'day
Lukasz Grabun wrote:
According to the spec
(http://www.w3.org/TR/REC-CSS2/text.html#indentation-prop) it indents
only the first line:
This property specifies the indentation of the first line of text in a
block.
So, the answer was and is correct.
Thanks Lukasz.
I tested my solution in MSIE6 and Firefox before sending it too.
They both behaved per spec, indenting only the first line of
each paragraph.
If the intention was to indent the whole paragraph, my suggestion
would have been along the lines of p { margin-left: 1em }
Regards
--
Bert Doorn, Better Web Design
http://www.betterwebdesign.com.au/
Fast-loading, user-friendly websites
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
RE: [WSG] Will HTML be nicer to PHP than XHTML?
Subject: Re: [WSG] Will HTML be nicer to PHP than XHTML? Personally, I believe this is one of the strong argumens for XHTML. PHP is very sloppy, and when you combine that with another sloppy language, HTML, the mess is tremendos. For small projects and new people it's not much of an issue, but try to maintain a large codebase without it being incredibly buggy. Using XHTML forces you towards good practices, something that is good to do from the begining before you develop those bad habits. I don't know who was objecting to using XHTML, but IMHO it will interfere with you learning of PHP less than HTML because it will force you to know what your doing, which is the point of learning. In PHP's defence, stupid sloppy code can be written in ANY language. (Don't believe me? Head over to http://www.thedailywtf.com and see some real-world examples.) PHP's lack of pickiness (compared to Java for example) is what has allowed it to be accessible to so many people, without requiring the very steep learning curve some other languages require. Good developers write good code. Period. let me repeat again. THERE IS NO LINK BETWEEN BAD HTML AND PHP. This thread needs to die.
[WSG] IE's doing it again
I've started building a new template to get my main content section as the first item in the source and solve some of my clearing problems. Works great everywhere, except, now image this, Internet Deplorer. The problem seems to be within either the nav or subnav lists that follow one another. I've gone around in circles to no avail. The file and CSS both validate and work on Safari, FF and Opera on the Mac side. IE doesn't play on Windows or the Mac side. I'm not sure if its my lists or the layout. Any help will be greatly appreciated. The files: http://vtest.jrations.com/test_page.php http://www.jrations.com/css/main_final.css wayne Wayne Godfrey [EMAIL PROTECTED] ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] font size in a table
I created a simple webpage containing a few paragraphs, a list and a table (for tabular data). For some reason that I cannot for the life of me work out, the font size of the text is much bigger in the table than elsewhere on the page. (Tested in FF, Safari, Opera/mac). It's driving me nuts! I want the text in the table to be the same size as elsewhere! What am I doing wrong??? Could someone please enlighten me? A mock-up of the page is here: http://hopestew.customer.netspace.net.au/ And the css is here: http://hopestew.customer.netspace.net.au/css/style1.css Hope Stewart ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] font size in a table
You have an incomplete doctype which makes browsers go into quicks mode and then font size inheritance is ignored inside a table. Russ I created a simple webpage containing a few paragraphs, a list and a table (for tabular data). For some reason that I cannot for the life of me work out, the font size of the text is much bigger in the table than elsewhere on the page. (Tested in FF, Safari, Opera/mac). It's driving me nuts! I want the text in the table to be the same size as elsewhere! What am I doing wrong??? Could someone please enlighten me? ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] font size in a table
Thanks, Russ! I've fixed the doctype on the real page and it works beautifully now. The page is on a site with a non-web standards design that I've inherited. It's due for a revamp in a couple of months when I plan to introduce standards. I thought I'd start to experiment with this new page but made the mistake of using a copy of an old page as my starting point. Updating the doctype hadn't occurred to me -- but it will now! Thanks again, Hope On 4/7/05 11:18 AM, russ - maxdesign [EMAIL PROTECTED] wrote: You have an incomplete doctype which makes browsers go into quicks mode and then font size inheritance is ignored inside a table. Russ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] textarea: why rows and cols?
Scott Swabey (Lafinboy Productions) wrote: I declare the height/width of textareas in CSS and don't use cols/rows in the markup. I haven't come across any problems in [ limited ] testing so far. Unfortunately a textarea without rows and cols attributes won't pass validation for xhtml 1.0 strict. I agree with the thread starter that the visual display size of a textarea should really be defined via CSS. If these were maxrows and maxcols, it would be a case for having it in the HTML, but as it stands this seems to muddy the line a bit too much... -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] textarea: why rows and cols?
Patrick H. Lauke wrote: I agree with the thread starter that the visual display size of a textarea should really be defined via CSS. If these were maxrows and maxcols, it would be a case for having it in the HTML, but as it stands this seems to muddy the line a bit too much... The need for the rows and cols attributes can be seen once you imagine the page without any CSS styling. Similarly, the requirement for the size attribute on a text input element and width and height on img the element. Ultimately CSS may not be available on all the devices for which we design and default rendering of unstyled elements will vary. -- Peter Asquith http://www.wasabicube.com/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] textarea: why rows and cols?
Peter Asquith wrote: The need for the rows and cols attributes can be seen once you imagine the page without any CSS styling. Similarly, the requirement for the size attribute on a text input element and width and height on img the element. Ultimately CSS may not be available on all the devices for which we design and default rendering of unstyled elements will vary. Personally, I find this type of answer quite dangerous, as it leads to a slippery slope. Yes, the default rendering of browsers may be different when CSS is not available, but does that mean we then still have to stuff visual cues in HTML? The same rationale would warrant the use of font colours, sizes, etc, imho. -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] Image Thumnail Advice
Hi Cole, Your mistake can also be step 3. If you're on a Windows box then you're quite possibly dealing with conflicting image resolutions. If you create a new image in Photoshop you'll notice that it's most likely set to 72dpi. I believe Windwos default is 80(?). I then recommend using the Image-Image Size... menu item to resize images, not Transform-Scale. If you're going to use a sharpen filter then go with Unsharp Mask ona settingn of about 150%, 1.2px, 7 threshold.You can then simply Ctrl-F to apply Last Filter in order to increase the effect if you want more. Paul From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Chris DawesSent: Sunday, 3 July 2005 1:57 PMTo: wsg@webstandardsgroup.orgSubject: RE: [WSG] Image Thumnail Advice Use save for web then use the resize tab below the output options. Chose jpeg medium from the top. Should be good quality output. Chris Dawes From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Cole Kuryakin - x7mSent: Sunday, 3 July 2005 12:28 PMTo: wsg@webstandardsgroup.orgSubject: [WSG] Image Thumnail Advice Hello All - I'm having a mess of a time getting sharp thumbnails of the site's I've built into a thumbnail format. Here's what I do: 1. Load the home page of a site into a browser 2. Use a screen capture utility to snap an image of the home page 3. paste the capture into PhotoShop 4. Transform/Scale the image from it's captured size (760 pixels x 550 pixels) down to a165x 115 pixel thumbnail And...everything turns to mud - or pretty close to it. If I sharpen the thumb, it's slightly better, but sharpen too much and it's "halo" city. Yuck. I know it's an issue of pixel loss during the reduction, but what to do? Surely there must be a better way as I've seen some sites with small thumbs of large images that are excellent looking. What are they doing (or what are YOU doing) that I'm not? Thanks to al in advance, Cole
RE: [WSG] SV: digest for wsg@webstandardsgroup.org
On this note, does anyone know how to dynamically recreate all the other
image alignment options currently available through HTML? E.g. absmiddle,
text-top etc., or are we stuck with right/left and then margin settings?
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
On Behalf Of tee
Sent: Sunday, 3 July 2005 2:07 PM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] SV: digest for wsg@webstandardsgroup.org
Importance: High
The obvious img{float:left} is not good - client dont want the text to
be displayed under the image.
If all images ware the same size - it would be simple - just add
margin to p, but its not like that... :( And i hate creating classes
like that: .img110px .img180px .
I think this is the better solution than the background image. You don't
need to declare image size but the margin or padding and float left or
right.
For example:
.image {
float: right; /* or left */
border: 2px solid #d3d3d3;
margin-left: 10px;
}
When image inserts to the p, your text will float around image according.
Examples from a site I was working:
http://clients.lotusseeds.com/dojoprocedures.html (I have the image
temporarily inserted in front of h3 )
http://clients.lotusseeds.com/style.html (image is inserted in the p tag)
If you want different padding/margin, border and float declared but don't
want to bother to create different classes in your css files, you can do
this:
p img src=yourimage.jpg alt= width=95 height=151 style=float:
left; margin-left: 0.7em; margin-bottom: 0.5em/ Blah blah blah /p
tee
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] textarea: why rows and cols?
Patrick H. Lauke wrote: Personally, I find this type of answer quite dangerous, as it leads to a slippery slope. Yes, the default rendering of browsers may be different when CSS is not available, but does that mean we then still have to stuff visual cues in HTML? The same rationale would warrant the use of font colours, sizes, etc, imho. I know what you mean, Patrick, but I think of the rows, cols, etc as topological, rather than decorative. While text can be quite happily shown in monochrome with nothing but native styling it is not so easy to default the topology of the elements - how do you know, by default, how many characters should be visible to the user in a text field, for instance? So there is a distinction, which I think is sufficient, but there's a distinctly slippery slope near at hand! Peter -- Peter Asquith http://www.wasabicube.com/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] font size in a table
Hi Hope, This was bugging me for ages too. I don't know _why_ it does it but my workaround to-date has simply been to implicitly set font-size for p, td and li. My table and list text usually display larger when I only set the font-size in the body element. I've asked this question before but is there a standard way to set the font size across all elements (irrespsective of inheritance)? -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Hope Stewart Sent: Monday, 4 July 2005 11:12 AM To: Web Standards Group Subject: [WSG] font size in a table I created a simple webpage containing a few paragraphs, a list and a table (for tabular data). For some reason that I cannot for the life of me work out, the font size of the text is much bigger in the table than elsewhere on the page. (Tested in FF, Safari, Opera/mac). It's driving me nuts! I want the text in the table to be the same size as elsewhere! What am I doing wrong??? Could someone please enlighten me? A mock-up of the page is here: http://hopestew.customer.netspace.net.au/ And the css is here: http://hopestew.customer.netspace.net.au/css/style1.css Hope Stewart ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] font size in a table
On 7/4/05, Webmaster [EMAIL PROTECTED] wrote:
Hi Hope,
This was bugging me for ages too. I don't know _why_ it does it but my
workaround to-date has simply been to implicitly set font-size for p, td and
li. My table and list text usually display larger when I only set the
font-size in the body element.
I've asked this question before but is there a standard way to set the
font size across all elements (irrespsective of inheritance)?
The modified Global White Space Reset has this:
* {
margin: 0;
padding: 0;
font-size: 100%; /* This sets _everything_ to one size */
}
Thereafter, you can specify rules for individual elements.
IE 5.x has a trouble with this, so you might want to add:
table {
font-size: 100%;
}
HTH,
Prabhath
http://nidahas.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] font size in a table
On 4/7/05 1:23 PM, Webmaster [EMAIL PROTECTED] wrote: This was bugging me for ages too. I don't know _why_ it does it but my workaround to-date has simply been to implicitly set font-size for p, td and li. My table and list text usually display larger when I only set the font-size in the body element. I've asked this question before but is there a standard way to set the font size across all elements (irrespsective of inheritance)? Thanks for your input. I had set the font-size for p ul and li and had used these tags within the td tags, but it still did not work. Russ supplied the answer for me: I was using the wrong doctype. I've changed: !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN html to: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en and all works beautifully. I don't fully understand all the components of doctypes, but the one I'm now using is working. Compare http://hopestew.customer.netspace.net.au/index.html to: http://hopestew.customer.netspace.net.au/index2.html The *only* difference in the code of these two pages are the first two lines, yet the font size behaves itself in the table on the second page because of the doctype. I don't know whether is would help in your case, but it created a miracle in mine! Hope ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
RE: [WSG] font size in a table
Yes I had no idea that doctype could effect CSS rendering like this. I was always scraed to use XHTML 1.0 strict but the combination below looks good. It will become my new standard. Thanks for asking the question. Paul -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Hope Stewart Sent: Monday, 4 July 2005 1:54 PM To: Web Standards Group Subject: Re: [WSG] font size in a table On 4/7/05 1:23 PM, Webmaster [EMAIL PROTECTED] wrote: This was bugging me for ages too. I don't know _why_ it does it but my workaround to-date has simply been to implicitly set font-size for p, td and li. My table and list text usually display larger when I only set the font-size in the body element. I've asked this question before but is there a standard way to set the font size across all elements (irrespsective of inheritance)? Thanks for your input. I had set the font-size for p ul and li and had used these tags within the td tags, but it still did not work. Russ supplied the answer for me: I was using the wrong doctype. I've changed: !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN html to: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en and all works beautifully. I don't fully understand all the components of doctypes, but the one I'm now using is working. Compare http://hopestew.customer.netspace.net.au/index.html to: http://hopestew.customer.netspace.net.au/index2.html The *only* difference in the code of these two pages are the first two lines, yet the font size behaves itself in the table on the second page because of the doctype. I don't know whether is would help in your case, but it created a miracle in mine! Hope ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] IE's doing it again
Wayne Godfrey wrote: I've started building a new template to get my main content section as the first item in the source and solve some of my clearing problems. Works great everywhere, except, now image this, Internet Deplorer. The problem seems to be within either the nav or subnav lists that follow one another. I've gone around in circles to no avail. The file and CSS both validate and work on Safari, FF and Opera on the Mac side. IE doesn't play on Windows or the Mac side. I'm not sure if its my lists or the layout. Any help will be greatly appreciated. The files: http://vtest.jrations.com/test_page.php http://www.jrations.com/css/main_final.css Wayne Godfrey Wayne, I'm sure someone will come up with all the hacks to make it work the way you want. But if not, since your main content isn't the first item in the source anyway, I'd suggest trying a stable 3 col layout that's known to work cross-browser http://www.alistapart.com/articles/negativemargins/. Put it in quirks mode to make it easy on yourself for IE, adjust the widths of the side columns to meet your need, add position relative to anything with a negative margin(for Mac/ie5.2), and enclose the whole ball of wax in a fixed width container-- tweak for Win/5x, and you're good to go... we'll almost. fwiw, check your current layout with images disabled. Good luck. David Laakso -- David Laakso http://www.dlaakso.com/ ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] font size in a table
Paul, To switch to standards compliant mode, you must have a full and complete doctype but it does NOT have to be XHTML at all. Hope could just have easily changed from an incomplete HTML4.01 Transitional doctype to a complete version. This is not a criticism of Hope, as she may have had other reasons for moving to XHML. For example this: !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN Could be changed to this: !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN http://www.w3.org/TR/html4/loose.dtd; And this would trigger standards compliant mode. The same is true for HTML4.01 Strict and other doctypes. The key here is using the full doctype including the url. Keep in mind that some people choose to use incomplete doctypes deliberately so that they can deal will IE5 and IE6 in the same way. This is fine as long as you are aware about the implications and can deal with them. As you can see, font-size inheritance into tables is one of these implications. For the full range of correct doctypes, go here: http://www.w3.org/QA/2002/04/valid-dtd-list.html Other doctype reading: http://www.alistapart.com/articles/doctype http://gutfeldt.ch/matthias/articles/doctypeswitch.html http://www.w3.org/International/articles/serving-xhtml/Overview.html#quirks http://www.quirksmode.org/css/quirksmode.html http://www.webstandards.org/learn/reference/prolog_problems.html http://www.tantek.com/XHTML/Test/minimal.html HTH Russ Yes I had no idea that doctype could effect CSS rendering like this. I was always scraed to use XHTML 1.0 strict but the combination below looks good. It will become my new standard. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
