SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Position question

    Hey everyone. I'm trying a page using no tables for layout purposes, and I'm a bit stuck. I'm trying to achieve a in-line block that is left aligned text, but padded over by 150px from it's containter TD. I think a screenshot will better illustrate.



    As you can see by my red guidelines, I want all the text to lineup in the same spot (right now, the spans just have a left-padding of 20px) and the wrapping needs to lineup too (for each item) as indicated by the arrow. Here is a 'photoshopped' example of how it should look.



    Here are the necessary styles, and a snippet of source code (the TD in question to be exact...)
    Code:
    <style>
    .param {
    	font-style: italic;
    	font-weight: bold;
    	}
    .paramDesc {
    	/* position: relative;
    	left: 100px; */
    	padding-left: 20px; /*
    	position: absolute;
    	left: 150px;
    	align: right;
    	width: 400px;
    	border: 1px solid black;*/
    	}
    </style>
    
    {...HTML...}
    <td>
    	<code>alt=&quot;decimal|<em>leftDigitsMin|leftDigitsMax|rightDigitsMin|rightDigitsMax</em>&quot;</code><br />
    	<span class="param">leftDigitsMin</span>
    	<span class="paramDesc"> Integer. Sets minimum number of digits that must appear to the left of the decimal</span>
    	<br />
    	<span class="param">leftDigitsMax</span>
    	<span class="paramDesc"> Integer. Sets maximum number of digits that must appear to the left of the decimal</span>
    	<br />
    	<span class="param">rightDigitsMin</span>
    	<span class="paramDesc"> Integer. Sets minimum number of digits that must appear to the right of the decimal</span>
    	<br />
    	<span class="param">rightDigitsMax</span>
    	<span class="paramDesc"> Integer. Sets maximum number of digits that must appear to the right of the decimal</span>
    </td>
    {...HTML...}
    If you are still confused, let me know.
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  2. #2
    SitePoint Addict Messiah's Avatar
    Join Date
    Jun 2001
    Location
    Bloomington, In.
    Posts
    216
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Seems to me that the logical thing to do would be to use a list. Its the correct heirarchical markup to use if you are going for tableless layout.

    Also, you can specify every property to suit your needs. You can remove the leading character or bullet and each list element would properly indent.

    You seem to have a solid grasp on css, so I am not including any sample styles. But if you would like one let me know. I use this method often in my own work and would be happy to provide if needed.
    Messiah | Ink-Press: web publishing simplified!

  3. #3
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Aha! A UL! I'll give it a shot and let you know how it goes! Thanks!

    Nanaman!
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev





Bookmarks

Posting Permissions

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