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 10 of 10

Thread: align right

  1. #1
    Regular Coder
    Join Date
    Oct 2003
    Location
    SC
    Posts
    936
    Thanks
    0
    Thanked 0 Times in 0 Posts

    align right

    how do i align an image (in css) right, so that the image does not go in the next line:

    I want text that is align left and then an image in the SAME line aling right

    is that possible?

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Posts
    676
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Re: align right

    Originally posted by JAVAEOC
    I want text that is align left and then an image in the SAME line aling right

    is that possible?

    jav...
    /me is just a guessing® 'cept just a fter® searchin' on google.com for... css align=right ... /me seems to see just a lotta® css saying to just a lign® the 'text' left n' the image twould thennn just a go® to the right???

    /me doesnt do css 'cept thought she try to offer just a suggestion® til the pros come just a long® lol...

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Sheffield, UK
    Posts
    552
    Thanks
    0
    Thanked 0 Times in 0 Posts
    style="float: right;" inside ur image tag should do it.

    Shouldn't really use inline styles but i'm sure you know how to move this into a stylesheet
    "To be successful in IT you don't need to know everything - just where to find it in under 30 seconds"

    (Me Me Me Me Me Me Me Me Me)

  • #4
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,714
    Thanks
    0
    Thanked 238 Times in 233 Posts
    Hi there JAVAEOC,

    This is how I would do it....
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <meta content="mshtml 6.00.2800.1264" name="generator" />
    <title>Float right</title>
    <style type="text/css">
    /*<![CDATA[*/
    <!--
    div#one{width:43%;float:left; text-align:justify;text-justify: newspaper;}
    div#two{width:56%;float:right;}
    //-->
     /*]]>*/
    </style>
    </head>
    <body>
    <div  id="one">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
    Praesent blandit venenatis purus. Integer massa libero, 
    vehicula id, consequat sed, tincidunt nec, purus. Class 
    aptent taciti sociosqu ad litora torquent per conubia 
    nostra, per inceptos hymenaeos. Suspendisse potenti. 
    Nunc vulputate magna non magna. Aenean lorem eros, 
    adipiscing quis, semper non, dictum a, nunc. Curabitur 
    ut sem. Pellentesque a est id neque hendrerit ultrices. 
    Donec vulputate tincidunt turpis. Curabitur dignissim 
    vestibulum nunc. Aliquam felis lorem, ultrices sit amet, 
    convallis a, accumsan vel, ante. Proin aliquam turpis 
    sed augue. In pellentesque, magna a pulvinar adipiscing, 
    est orci adipiscing felis, sed laoreet urna magna quis 
    neque. Proin facilisis aliquet urna.
    </div>
    <div id="two">
    <img src="some.gif"alt="name of the picture"width="324"height="200"/>
    </div>
    </body>
    </html>
    cthead

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    Sheffield, UK
    Posts
    552
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you you would wrap a paragraph in a div tag without using a <p> tag, wrap an image needlessly in an empty div and assign IDs that have no bearing on their content?

    good plan.
    "To be successful in IT you don't need to know everything - just where to find it in under 30 seconds"

    (Me Me Me Me Me Me Me Me Me)

  • #6
    Regular Coder
    Join Date
    Oct 2003
    Location
    SC
    Posts
    936
    Thanks
    0
    Thanked 0 Times in 0 Posts
    with this float right stuff the image still goes in the next line

    and with the two div containers the image would not be aligned right

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    Sheffield, UK
    Posts
    552
    Thanks
    0
    Thanked 0 Times in 0 Posts
    put the image first then float it right:

    <p><img src="whatever.jpg" style="float: right" />Blah blah blah blah blah blah blah blah blah</p>
    "To be successful in IT you don't need to know everything - just where to find it in under 30 seconds"

    (Me Me Me Me Me Me Me Me Me)

  • #8
    New to the CF scene
    Join Date
    Jul 2003
    Location
    Minnesota
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    or like he said except instead of style="float... just use align="right"

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Posts
    676
    Thanks
    1
    Thanked 0 Times in 0 Posts
    /me just a whispers® to isl...
    "quote...instead of style="float... just use align="right"...endquote"

    thattts how /me would just a do® it tooo...'cept theyyy are just a looking® on howww to do it via css...aka /me thinks ourrr method??? isnt just a proper/uptostandard® coding...lol...

  • #10
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Hey JAVAEOC,

    I have the same thing on my website, http://richardmedek.com/current/. On the left is an img that says "Current" and on the right is an img with the links "prev/next". What I did was, since the basic page was aligned to the left, used a class "right" in the css
    Code:
    .right {clear:both; float:right}
    (you know, I don't remember what the clear:both is doing in there, but I remember it was needed ) and then put this in the XHTML...
    Code:
    <span class="right"><img src="../imgs/prev.gif" width="50" height="25"  alt="prev" />...etc...</span><img src="../imgs/titlecurrent.gif" width="200" height="25" alt="" />
    Note that the item on the right is actually typed first, because the float takes the element out of the flow.

    Hope this helps...

    -Rich


  •  

    Posting Permissions

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