Click to See Complete Forum and Search --> : compatibility of CSS with browsers
irlynjl
08-17-2007, 10:28 PM
Hi!
I made a css file where I could indent a paragraph. However, it worked only in internet explorer but not in mozilla firefox. I'm not sure if it will work also in Opera. Is CSS suitable only to internet explorer?
Hope you can help me with this.
Thanks!
coothead
08-17-2007, 11:38 PM
Hi there irlynjl,
a link to your problematic site, would give the members here an opportunity to solve your problem. ;)
coothead
Major Payne
08-18-2007, 01:14 AM
If you're indenting text in a paragraph, try setting this on your CSS: p {text-indent: 3em;} or whatever value of em you wish to use. If you want a weird effect like first line hanging out (hanging indent), then use: p {text-indent: -3em;}. Use this with care. Add some left margin or left padding to keep a hanging indent from being cut off by the browser window.
Ron
drhowarddrfine
08-18-2007, 08:52 AM
Is CSS suitable only to internet explorer?Internet Explorer is nine years behind web standards and the worst CSS offender. Never rely on IE to do anything right.
WebJoel
08-18-2007, 09:50 AM
Would not "p {text-indent:foo;}" indent the entire paragraph?
Why would p:first-line {text-indent:foo;} not be a better solution? Merely moving a semantically marked-up "<p>" (indenting) could be just as easily done with left-margin:foo;, but if you wanted just the first line of any/every "<p>" 'indented'... the pseudo-class is there.
Jeff Mott
08-18-2007, 10:04 AM
Would not "p {text-indent:foo;}" indent the entire paragraph?Nope.
http://www.w3.org/TR/CSS21/text.html#propdef-text-indent
felgall
08-18-2007, 07:21 PM
text-indent only indents the first line. To indent the entire paragraph you would use padding
irlynjl
08-25-2007, 02:13 AM
Hi,
Thanks a lot for the help. I made use of padding and it helped but I have another concern that is I want bullets to appear instead of numbers that I placed before each item.
Here is my source code
<html>
<head>
<style>
.padshort{ padding-left: 45px;font-weight:bold; }
.padlong{ padding-left: 71px; }
</style>
</head>
<body>
<table>
<tr><td>
<p class="padshort">Personal Items</p>
<p class="padlong">
1.umbrella<br>
2.bag<br>
3.shoes</p>
</td></tr>
</table>
</body>
</html>
felgall
08-25-2007, 02:40 AM
If you have a list then mark it up as a list and it will generate the markers (numbers or bullets) for you.
Numbered list.
<ol>
<li>umbrella</li>
<li>bag</li>
<li>shoes</li>
</ol>
Bulleted list
<ul>
<li>umbrella</li>
<li>bag</li>
<li>shoes</li>
</ul>
Also you have no tabular data in your page and so should not be using a table.