?
Solved

text and select horizontaly aligned

Posted on 2010-09-07
8
Medium Priority
?
166 Views
Last Modified: 2012-05-10
want the text before the select area to begin at the same place
want the select box to begin at the same place

text1          select1
text200      select200
text20001   select20001
<style>
.selectstyle1{
  margin-left:0px;
  font-size:10pt;
  width:200px;
}
.divstyle1{
  margin-left: -10px;
  margin-bottom: 25px;
  font-size: 10pt;
}
</style>

<div class="divstyle1">Condition of Product:
<select class="selectstyle1">
</select>
</div>

<div class="divstyle1">Condition of Product2:
<select class="selectstyle1">
</select>
</div>

<div class="divstyle1">Condition of Product3:
<select class="selectstyle1">
</select>
</div>

Open in new window

0
Comment
Question by:rgb192
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
8 Comments
 
LVL 13

Expert Comment

by:George K.
ID: 33620496
use the following accordingly


<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

0
 
LVL 7

Expert Comment

by:inxil
ID: 33620518
0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 33623881
<style>
   .span1{
     width:50px;
     max-width:50px !important;
     min-width:50px !important;
   }
   .span1{
     width:60px;
     max-width:60px !important;
     min-width:60px !important;
   }
</style>

<ul>
  <li>
     <span class="span1">Row1text1</span>
     <span class="span2">Row1text2</span>
  </li>
  <li>
     <span class="span1">Row11text1</span>
     <span class="span2">Row11text2</span>
  </li>
  <li>
     <span class="span1">Row111text1</span>
     <span class="span2">Row111text2</span>
  </li>
</ul>
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:rgb192
ID: 33628484
I edited answer from gurvinder372


and got
Row1text1 select1text2
Row11text1 select11text2
Row111text1 select111text2
<style>
   .span1{
     width:50px;
     max-width:50px !important; 
     min-width:50px !important; 
   }
   .span2{
     width:60px;
     max-width:60px !important; 
     min-width:60px !important; 
   }
</style>

<ul>
  <li>
     <span class="span1">Row1text1</span>
     <span class="span2">select1text2</span>
  </li>
  <li>
     <span class="span1">Row11text1</span>
     <span class="span2">select11text2</span>
  </li>
  <li>
     <span class="span1">Row111text1</span>
     <span class="span2">select111text2</span>
  </li>
</ul>

Open in new window

0
 

Author Comment

by:rgb192
ID: 33628501


I cant use tables
I must use div
0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 33628609
did that worked for you?
0
 
LVL 40

Accepted Solution

by:
Gurvinder Pal Singh earned 2000 total points
ID: 33628648
this worked for me in ff
<style>
   .div1{
     width:150px;
	 float:left;
   }
   .div2{
     width:160px;
	 float:left;
   }
</style>

<ul>
  <li>
     <div class="div1">Row1text1</div>
     <div class="div2">select1text2</div>
  </li>
  <li>
     <div class="div1">Row11text1</div>
     <div class="div2">select11text2</div>
  </li>
  <li>
     <div class="div1">Row111text1</div>
     <div class="div2">select111text2</div>
  </li>
</ul>

Open in new window

0
 

Author Closing Comment

by:rgb192
ID: 33629256
thanks
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
Suggested Courses
Course of the Month12 days, 23 hours left to enroll

777 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