dcsimg
www.webdeveloper.com
Results 1 to 7 of 7

Thread: button trouble !

  1. #1
    Join Date
    Jul 2012
    Posts
    29

    button trouble !

    hi quick question i have a logo i want on the left and two buttons i want on the right

    in line with the logo so buttons are actualy central to the logo

    ive tried it with using valign top br br it doesnt work

  2. #2
    Join Date
    Jun 2012
    Location
    Dark Side of the Moon
    Posts
    70
    Some codage would be nice, but have your tried to valign=middle, that should put it in the middle of a cell or div on the vertical axis. so is you are going for a layout that looks something like |||||||--, | being your image, and - being your buttons, then valign middle should work for you.

  3. #3
    Join Date
    Jul 2012
    Posts
    29
    Quote Originally Posted by burnme View Post
    Some codage would be nice, but have your tried to valign=middle, that should put it in the middle of a cell or div on the vertical axis. so is you are going for a layout that looks something like |||||||--, | being your image, and - being your buttons, then valign middle should work for you.
    thanks for that iam trained i should know !!!!!!

  4. #4
    Join Date
    Jul 2012
    Posts
    29
    Quote Originally Posted by burnme View Post
    Some codage would be nice, but have your tried to valign=middle, that should put it in the middle of a cell or div on the vertical axis. so is you are going for a layout that looks something like ,|||||||-- | being your image, and - being your buttons, then valign middle should work for you.
    it doesnt work matey valign middle it does this ||||||| _ _ not |||||||--

    the code is -

    <valign=top><img src="logo.png"</a>&nbsp;&nbsp;&nbsp;<valign=middle><input type="button"........&nbsp;&nbsp; iam aligning the button away from the border in a table ending it with &nbsp;&nbsp;

    i have the table sized 700 inc width of logo + allow space around the buttons

    i have the logo up against the top and left border of the table

    what i need is this ||||||| = 2 buttons

  5. #5
    Join Date
    Jul 2012
    Posts
    29

    Ive Sorted It

    Its Confusing -

    it was just this align logo left no p align then p align left button <br><br><br> p align left second button

  6. #6
    Join Date
    Jul 2012
    Posts
    20
    If I might throw in my 2 cents.

    valign only works in a table cell, but is inconsistent in different browsers.
    Try using <p align="center"> (or div or span, but "p" works better for this) to center the logo horizontally, then for the image buttons, try: <img src="...../image.jpg" style="float:right;"> for the image on the left side, and "float:left;" for the image on the right side. If I understand you correctly, that should give you the -[]- that you are looking for. I haven't tried this lately so I can't be sure it works right, but if it doesn't just position the misaligned images relative, like: <img src="..../image.jpg" stye="position:relative;top:-12px;left:0px;"> that moves an image up 12 pixels. It works really well and is very consistent between browsers.

    Hope that helps.

  7. #7
    Join Date
    Jul 2012
    Posts
    20
    <valign=top><img src="logo.png"</a>&nbsp;&nbsp;&nbsp;<valign=middle>

    ( valign should go inside the img tag - <img src="logo.png" valign="middle"> )
    I should pay closer attention. You want the logo on the left and two buttons vertically on the right side, like []= ?
    <img src="logo.png"><img src="button_top.gif" style="float:left;"><br><img src="button_bottom.gif" style="float:left;"><br>

    Something like that or try float:left on the logo image. I forgot which way works best. You can also add the positioning along with that to get it just right. This should be consistent in all browsers.
    Last edited by Williamsun; 07-30-2012 at 02:48 AM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles