Solved

Problem with alignment in HTML

Posted on 2007-11-13
8
212 Views
Last Modified: 2012-06-27
I want to align the letter like the below example in html. How do I do it?? I not getting it right.

     (a)  dasdas
   (ab)  sadsad
  (abc) sadsad           < ------------   //This is what I want, align the bullet to the right.
(abcd) sad
//////////////////////////////////////////////////////////////////////////////////////////////
(a)       dasdas
(ab)     sadsad
(abc)   sadsad           < ------------   //This is what I do not want, I do not want like this ! ! !
(abcd) sad

   
0
Comment
Question by:xiaoxin85
8 Comments
 
LVL 3

Expert Comment

by:samalraj
ID: 20278112
Hi,
     you could use like
<table border=0>
<tr>
 <td align="right">(a)</td><td>  dasdas</td>
</tr>
<tr>
 <td align="right">(ab)</td><td>  dasdas</td>
</tr>

<tr>
 <td  align="right">(abc)</td><td>  dasdas</td>
</tr>

<tr>
 <td  align="right">(abcd)</td><td>  dasdas</td>
</tr>
</table>

0
 

Author Comment

by:xiaoxin85
ID: 20278115
is there any way except for table??? I do not want to use a table, is there other right??? like in css???
0
 
LVL 3

Expert Comment

by:samalraj
ID: 20278163
Hi,
     you could do it like this
<ol type="I">
 <li>Apples</li>
 <li>Bananas</li>
 <li>Lemons</li>
 <li>Oranges</li>
 <li>Apples</li>
 <li>Bananas</li>
 <li>Lemons</li>
 <li>Oranges</li>
</ol>

type can be
type="I"
type="i"
type="1"
type="a"
type="A"
 



0
Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

 
LVL 16

Accepted Solution

by:
kiranvj earned 250 total points
ID: 20278195
or like this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
.align_right {
      text-align:right;
      width:100px;
      float:left;
}
.align_left {
      text-align:left;
      width:100px;
      float:left;
}
</style>
</head>

<body>
<div class="align_right">(a)</div><div class="align_left"> dasdas</div><br />
<div class="align_right">(ab)</div><div class="align_left"> ddfasdas</div><br />
<div class="align_right">(abc)</div><div class="align_left"> sddas</div><br />
<div class="align_right">(abcd)</div><div class="align_left"> ada</div><br />
</body>
</html>
0
 
LVL 18

Assisted Solution

by:Eternal_Student
Eternal_Student earned 250 total points
ID: 20279028
This is even better ;-)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
dt{float:left;}
dt span{width:40px; display:block; text-align:right}
dd{padding-left:4px;}
</style>
</head>

<body>
      <dl>
            <dt><span>(a)</span></dt>
            <dd>Black hot drink</dd>
            <dt><span>(ab)</span></dt>
            <dd>White cold drink</dd>
            <dt><span>(abc)</span></dt>
            <dd>White cold drink</dd>            
      </dl>
</body>
</html>
0
 

Author Comment

by:xiaoxin85
ID: 20287246
it is gd but mi need something like if it have more than 1 line, like the 1 below.

     (a)  dasdasdsadsdasdasdasdasd
            dsadasdsadasd
   (ab)  sadsad
  (abc) sadsad          
(abcd) sad
0
 
LVL 1

Expert Comment

by:Computer101
ID: 20558535
Forced accept.

Computer101
EE Admin
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Underline in nav for the page that you are currently on. 1 22
Html Table looping 4 25
Wordpress Security 29 48
Insert Button on a table 16 37
Developer portfolios can be a bit of an enigma—how do you present yourself to employers without burying them in lines of code?  A modern portfolio is more than just work samples, it’s also a statement of how you work.
This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question