SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    introduction and help needed

    hi, I'm Sin, and I'm new here, nice to meet you all

    i'm still an amateur in web designing especially in xhtml and i have problems with my project, currently i'm using xhtml and i'm having trouble making my form in order, the form is sort of like this :

    name:blabla
    address:blablabla

    how do i make it into this :

    name : blablabla
    address : blablabla

    thx a lot for the help

    ~sin~

  2. #2
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm sorry, I don't get what you're trying to achieve. Your 2nd example is different from the first only in that you've added spaces around the :

  3. #3
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ow, what i mean is, i want to make the name and the address textbox that we will fill later in the same alignment, how do i do that ?

    ~sin~

  4. #4
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It depends which way you want them aligned. Are the inputs aligned along their left or right edges or is the text aligned left or right?

  5. #5
    SitePoint Enthusiast
    Join Date
    Sep 2006
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hows about having all the text labels on the line above the box with the box on the next line. This way all of your labels are aligned and the start of your boxes are aligned, however different their sizes are.

    Something like http://www.chic-wedding-cars.co.uk/bookings.html.

  6. #6
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    actually, i want my site to be like this site http://two.guestbook.de/register.cgi
    but i can't seem to get it right

  7. #7
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK, so now we've seen what it's s'posed to look like. Now we need to see what you've got so far.

  8. #8
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the code so far is like this

    .line{
    display:inline;
    }

    <div><form name="purchaseForm" action="process.php" method="post">

    <fieldset>
    <legend>This is a label for the folder</legend>

    <div>
    <label class="line">First Name </label>
    <input type="text" class="textInput" name="fName" id="fName" value="" />
    </div>

    <div>
    <label class="line">Street Address</label>
    <input type="text" name="str_addr" id="str_addr" />
    </div>

    <div>
    <label class="line">City</label>
    <input type="text" name="city" id="city" />
    </div>

  9. #9
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Instead of display: inline, make your labels float: left and give them a width.

  10. #10
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i try that and it doesn't work instead of making them like the site, mine turns into a stairs, did i do something wrong ?

  11. #11
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Probably, cos I did a quick test when before I posted and it looked OK. Would need to see your page or more of you code to tell for sure.

  12. #12
    SitePoint Member
    Join Date
    Aug 2006
    Location
    Indonesia
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i got it now, thanks for the help

  13. #13
    Guru Meditation Error gnarly's Avatar
    Join Date
    Dec 2003
    Location
    Cheltenham, United Kingdom
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by aoshima
    i try that and it doesn't work instead of making them like the site, mine turns into a stairs, did i do something wrong ?
    It'll be because you didn't clear your floats. There's a couple of ways to fix this:

    First way: Very simply makes sure each div and it's contents will appear below any floated elements:
    Code:
    fieldset div {
         clear: both;
    }
    More: http://www.w3schools.com/css/pr_class_clear.asp

    Second way is a little more complex, and makes the div expand to contain any floated elements:
    Code:
    fieldset div {
         height: 1%;
         overflow: hidden;
    }
    More: http://www.pmob.co.uk/temp/float-clear.htm
    Olly Hodgson
    thinkdrastic.net


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
  •