?
Solved

Rounded corner textbox overflowing in IE

Posted on 2008-11-07
2
Medium Priority
?
1,088 Views
Last Modified: 2012-05-05
Hi,

I've been trying to get a rounded corner textbox working using CSS with a background image.

A sample can be found here: http://www.qecomm.com/header.html

It works fine in Firefox etc but in IE6 and 7 when you type too much text it overflows out of rounded textbox image. I've seen this method used on tutorial sites. But their textbox doesn't seem to overflow. It could possibly be the absolute positioning I'm using. I'm not sure. Hoping someone else has encountered this same problem.

Any help is much appreciated.

Quintin
0
Comment
Question by:qdh
2 Comments
 
LVL 30

Accepted Solution

by:
Mark Steggles earned 2000 total points
ID: 22916450
Hello,

try putting the image on the containing div like:

#topbox {
      position:absolute;
      margin:0;
      left:730px;
      top:72px;
      width:144px;
      height:22px;
      background:url(http://www.qecomm.com/topbox.gif) no-repeat scroll left top;
   
}
.tb-rounded {
background-color:transparent;
    border:0;
      margin:0;
    height:15px;
    width:134px;
      padding: 4px 4px 4px 4px;      
}
0
 

Author Closing Comment

by:qdh
ID: 31514344
It worked! Thanks heaps for that.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

This article discusses how to create an extensible mechanism for linked drop downs.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

864 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