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
  1. #1
    New Coder
    Join Date
    Jun 2011
    Posts
    65
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Text align in one line

    Hello,

    Here is my website: http://visionarycreativegrp.com/Demos/ForSale%20RED/#

    As seen on my preview: http://img822.imageshack.us/img822/6533/unled1pd.jpg

    I would like to put text on the same line just on opposite sides of the headlines box. I have no clue what to do

    Thanks

  • #2
    Regular Coder Microsuck's Avatar
    Join Date
    Oct 2011
    Location
    127.0.0.1
    Posts
    123
    Thanks
    44
    Thanked 5 Times in 5 Posts
    "the" text.
    Care to elaborate?

  • #3
    New Coder
    Join Date
    Jun 2011
    Posts
    65
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Microsuck View Post
    Care to elaborate?
    It's in the preview. Look at the box under the login section. It's a clear display of what's supposed to be there.

  • #4
    Regular Coder Microsuck's Avatar
    Join Date
    Oct 2011
    Location
    127.0.0.1
    Posts
    123
    Thanks
    44
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by Canman07 View Post
    It's in the preview. Look at the box under the login section. It's a clear display of what's supposed to be there.
    I'm failing to understand what you're trying to accomplish.

  • #5
    New Coder
    Join Date
    Jun 2011
    Posts
    65
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Microsuck View Post
    I'm failing to understand what you're trying to accomplish.
    If you open the Preview: http://img822.imageshack.us/img822/6533/unled1pd.jpg

    You will see the text "Back2Back Gaming Wins ESWC 2011" and then there is a "12" in a text bubble. I am asking if someone knows how to get it so that i can do that with code.

  • #6
    Regular Coder Microsuck's Avatar
    Join Date
    Oct 2011
    Location
    127.0.0.1
    Posts
    123
    Thanks
    44
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by Canman07 View Post
    If you open the Preview: http://img822.imageshack.us/img822/6533/unled1pd.jpg

    You will see the text "Back2Back Gaming Wins ESWC 2011" and then there is a "12" in a text bubble. I am asking if someone knows how to get it so that i can do that with code.
    Do WHAT?!

  • #7
    New Coder
    Join Date
    Jun 2011
    Posts
    65
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Microsuck View Post
    Do WHAT?!
    So i can alight the NUMBER on the same line as the title. Read in between the lines. It wasnt that difficult to understand.

  • #8
    Regular Coder Microsuck's Avatar
    Join Date
    Oct 2011
    Location
    127.0.0.1
    Posts
    123
    Thanks
    44
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by Canman07 View Post
    So i can alight the NUMBER on the same line as the title. Read in between the lines. It wasnt that difficult to understand.
    It is for me, considering the number is already on the same line as the title...


  • #9
    New Coder
    Join Date
    Jun 2011
    Posts
    65
    Thanks
    9
    Thanked 0 Times in 0 Posts
    yes... but how do i get that in there on code... how do i space it out that far? When i hit space or tab multiple times, it only spaces it 1 space..

  • #10
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Quote Originally Posted by Canman07 View Post
    yes... but how do i get that in there on code... how do i space it out that far? When i hit space or tab multiple times, it only spaces it 1 space..
    The text in an li is fine. The little comment bubble image on the right might be a little more work to land text into.
    Try a span though, something like this -
    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=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    html, body {background: #333;}
    #headlines {
    	background:url(http://visionarycreativegrp.com/Demos/ForSale%20RED/images/headlinebox.png);
    	width: 387px;
    	float: right;
    	margin: 5px 0 0;
    	overflow: auto;
    	clear: right;
    }
    ul#headlinelink {
    	margin: 0;
    	padding: 0;
    	list-style: none;
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 13px;
    }
    #headlinelink li {
    	line-height: 29px;
    	width: 387px;
    	float: left;
    }
    #headlinelink li a {
    	width: 240px;
    	padding: 2px 5px;
    	float: left;
    	display: block;
    	text-decoration: none;
    	color: #fff;
    }
    	#headlinelink a:hover {color: #f00;}
    #headlinelink span {
    	width: 40px;
    	float: right;
    	margin: 2px 2px 0 0;
    	color: #000;
    }
    </style>
    </head>
    <body>
        <div id="headlines">
            <ul id="headlinelink">
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
                <li><a href="#">Back2Back Gaming Wins ESCW 2011</a><span>12</span></li>
            </ul>
        <!--end headlines--></div>
    </body>
    </html>
    Just copy/paste that entire snippet into a new .html document and view it in your browser.

    I think it would work better if the image was a single line w/thought bubble as a background of each li, instead of one big background on #headline.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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