How to set a textbox to align to the left? - html

My website has a contact form where I want the input fields be lined up to the left, currently they are to the right. I am not good at css, I can't even find out what element I should change attribute, although I know it's an easy job using FireBug. Can someone tell me how? Thank you so much.

In neon.css remove the entry float: right; from the respective style definitions. Of course you will then have to position them to lign up beneath eachother.
.foxform input, .foxform textarea {
...
float: right; <-- remove this
}
.fox-dropdown-container {
...
float: right; <-- and remove this
}

text-align: left; or float: left;

Related

How to make sharing icon in one row?

I am really bad with css and html, can somebody help with this simply problem?
On the bottom of the [site][1] i have text and sharing icons. How can i make them in one row? Like on right from text. It looks horrible now.
Thank you!
here:
this css should work:
.text-muted {
display: inline-block;
}
div.ya-share2 {
display: inline-block;
float: right;
margin-top: 20px;
}
explain: it makes both elements able to coexist in the same line, plus the margin-top is just for aligning it.
add that to your CSS file and youre good to go

How to put unordered (gif image) list in middle?

I have an unordered list within a body and the body tag is aligned to the center, the text for the ul list goes to the middle but the gif image stays to the left side of the page. How do I fix this?
http://www.student.nvcc.edu/home/kosindi/test/ul.html
That is a link to my website which has an example of my problem.
Please explain your logic, thank you.
as per your HTML code you gave in link just few change will do.
in css
body {
padding-left: 45%; // add this css
text-align: left; // change this css
}
You have two variants, choose one:
1.Use this CSS and it will work:
li { list-style-position: inside; }
2.If you want the basket balls to appear one under another then use this CSS:
body { text-align: left; }
ul { width: 200px; margin: 0 auto; }

put div on different line

I want to build a list of itens. Each item should be in one line, like several paragraphs.
Why my div.empresa elements are on same line? I think they should be on different lines because the display property of them is block.
Take a look at code:
http://jsfiddle.net/Yz8Cq/
You need to remove float: left;
#ListaDeEmpresas .arrow {
height: 50px;
width: 20px;
background: url("/Content/SetaBrancoh40.png") no-repeat center center;
background-color: #A9462F;
}
http://jsfiddle.net/spacebeers/Yz8Cq/5/
Floats can be a bit tricky to get your head around at first. This article is excellent - http://css-tricks.com/all-about-floats/
Actually, removing float: left from the label will make the arrow span appear to the left of the label. Assuming you want the arrow spans to continue to show up on the right of the labels, then you want to add:
#ListaDeEmpresas div.empresa {
clear: left;
}
This will make sure each label/span set appears below the previous one.
Get rid of the float: left; in #ListaDeEmpresas .arrow
The float: left; is making them do that.

input fields alignment issues

input field are not getting aligned and they flow out of the container. What causes that? Here is the code and page. I need the labels aligned left and input field all aligned too. Is it ok to give -ve margins??
the .para#info div is flowing out of the page. It is supposed to sit parallel with .para#news
You have overdone your CSS and have many unneeded properties.
Start by giving your label the following CSS properties, then style the inputs as you wish.
label {
width: 100px;
display: inline-block;
margin: 2px 6px 6px 4px;
text-align: right;
font-weight: bold;
color: #555;
}
Check working example at http://jsfiddle.net/6Eyef/1/
Its ok if you use..
margin-left: -220px;
margin-top: -150px;
for info Div.
thank you.
I'm not sure if I understand your question correctly. But to align <input> elements with their labels, the <label> tags need to have to following CSS:
display: block;
float: left;
width: (a value)px;
And you need to add clear: left to the <input> elements
Edit: Hussein's answer is better

Styling bug that switched form field orders

I have had the same login form and create_profile form for a long time. Yesterday some style changes were made on the site and today to my amazement, these two forms have fields reversed.
Here is the example of what I am talking about:
http://www.hikingsanfrancisco.com/create_profile.php
I am not very knowledgeable in CSS issues, and I have never seen something like this. Any idea what may be causing this?
Thanks,
Alex
label span has been floated right in your CSS:
label span {
float: right;
width: 15em;
}
Change it to:
label span {
float: left;
width: 15em;
}