Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9

Thread: Indent with CSS

  1. #1
    Regular Coder
    Join Date
    Oct 2004
    Location
    In front of this computer. (Where else?)
    Posts
    442
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Indent with CSS

    Hi guys, i'm an extreme newbie to CSS. Just picked it up yesterday and i can already see a lot of advantage over tables. My question now is this. How do i make some text have a 10px indent form both top and left (as opposed to having a table and using Cellpad = 10)

    Edit: OK, i got this so far. If i remove the colour attribute, it displays a black border. I want the border to be invisible and not display any colour but just to indent the element.


    Code:
    .tab {
    border: 10px solid rgb(0,0,0)
    }
    Thanks
    Last edited by tboss132; 01-27-2005 at 12:31 PM. Reason: Question rephrase
    Tomorrow is the first day of the rest of your life... What have you done today?
    Tutorials
    Web: w3schools, htmldog General tips: Hardware, Networking

  • #2
    New Coder
    Join Date
    Jan 2005
    Posts
    25
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hey, quick question! What site are you looking at, to learn how to use it? I really suck at it! Thanks!

  • #3
    Regular Coder
    Join Date
    Oct 2004
    Posts
    256
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    .tab {
       padding-left: 10px;
    }
    The only problem with that is that it will apply to the whole of anything styled as .tab. But then so will borders.

  • #4
    Regular Coder
    Join Date
    Oct 2004
    Posts
    256
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh yes:

    Code:
    p:first-letter { padding-left: 10px; }
    That will do exactly what you want, but it's not supported by IE5, IE6, or Mac IE5.

  • #5
    Regular Coder
    Join Date
    Oct 2004
    Location
    In front of this computer. (Where else?)
    Posts
    442
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Sayonara
    Code:
    .tab {
       padding-left: 10px;
    }
    The only problem with that is that it will apply to the whole of anything styled as .tab. But then so will borders.
    I didn't know someone had replied while i was editing. I added
    Code:
    .tab {
       padding-left: 10px;
    padding-top: 10px;
    }
    and now it works fine. Do you think it's better to just put it in the div instead of defining in an external CSS?
    Thanks for the info.

    Quote Originally Posted by onggie
    Hey, quick question! What site are you looking at, to learn how to use it? I really suck at it! Thanks!
    http://www.w3schools.com/css/css_intro.asp
    Beautiful site to learn from...
    Tomorrow is the first day of the rest of your life... What have you done today?
    Tutorials
    Web: w3schools, htmldog General tips: Hardware, Networking

  • #6
    New Coder
    Join Date
    Jan 2005
    Posts
    25
    Thanks
    0
    Thanked 0 Times in 0 Posts
    For some reasoon I find that site very hard to learn from, but thanks anyway!

  • #7
    Regular Coder
    Join Date
    Oct 2004
    Location
    In front of this computer. (Where else?)
    Posts
    442
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Arrow

    Well onggie, you could do a google
    http://www.google.com/search?q=css%20tutorials
    As expected w3schools will be the first on the list.

    Thanks again Sayonara.
    Tomorrow is the first day of the rest of your life... What have you done today?
    Tutorials
    Web: w3schools, htmldog General tips: Hardware, Networking

  • #8
    Regular Coder
    Join Date
    May 2004
    Location
    Berkeley, California Age: 15
    Posts
    398
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hey...some standard CSS for indent the first line of a paragraph:

    p {
    text-indent: 20px;
    }

    you don't have to use css3 (?) selectors for that. And it works cross-browser in my experience...good luck!
    Jalenack.com .:. YWDA Founder .:. Rounded Corners Maker 1.1! .:. My Blog
    The hardest thing about teaching is not knowing the right answers, but knowing the right questions - Elisabeth Klein
    Pretty buttons does not a great website make.

  • #9
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    margins, or padding

    I don't think he actually meant indentation, since he also need it from the top...

    Basically, both margins and padding could be used, depending on whether there's a border and/or a background effect (color or image). In most cases, to create whitespace around any content, margins do the job well.
    For any directed recommendations you need to supply a lot more info, though.

    I used to recommend W3Schools as a starting place for learning HTML, CSS, etc, and it still has merit, but recently HTML Dog has come into the picture as a source for pretty nice tutorials. There are many other online resources, though, that usually address more specific topics.
    Regards,
    Ronald.
    ronaldvanderwijden.com


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •