Solved

css Input text - move cursor position

Posted on 2012-04-05
7
2,239 Views
Last Modified: 2012-04-10
Hi,

I have a input text form, i am trying to move the cursor position 12px to the right - i can use padding-left but the text starts overflowing. Does anyone have any solutions to this?

	    <div id="mainTop3">
			<form name='search' method='post' action='#'>
				    
				    <div class='search_box'><input type='text' name='search_box'/></div>
				    <div class='search_button'><input type='submit' /></div>
				    
			</form>
			
	    </div>

Open in new window



css

#mainTop3 .search_box input{height:52px; width:234px; background:url(../images1/search_bar.png) 0 0 no-repeat;margin-top:8px; padding-left:12px; margin-left:200px; float:left; border:0; }

Open in new window

thanks in advance
0
Comment
Question by:MK15
  • 4
  • 2
7 Comments
 
LVL 7

Expert Comment

by:Atique Ansari
ID: 37811648
Please attach the background image as well.
0
 

Author Comment

by:MK15
ID: 37811660
overflow
0
 
LVL 30

Assisted Solution

by:LZ1
LZ1 earned 500 total points
ID: 37811777
Just add padding-right:5px to the CSS.
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

Author Comment

by:MK15
ID: 37811788
I've tried that made no difference - will give it another go
.....just tried it - didn't work
0
 
LVL 30

Expert Comment

by:LZ1
ID: 37811798
Can you attach your actual background image instead of a screenshot?
0
 

Accepted Solution

by:
MK15 earned 0 total points
ID: 37811836
I fixed it by subtracting the left padding value from the width of the box.

thanks for your help
0
 

Author Closing Comment

by:MK15
ID: 37826755
possible solution to the problem - fixed the issue
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

708 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

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now