Poor IE display issues

HTML & CSS
1

Just see the different

576×654 47.9 KB

And here the website that i work http://en.dhkeno.ru

EDIT
Note this site is Gambling related and may trigger “Adult” filters

2

Yeah, these are resolvable issues. As @RyanReese says, post a thread with specifics - screenshots, what versions of IE don’t work, and any code you have for the items that are not displaying properly.

1 Like
3

Just come to http://en.dhkeno.ru , and see whats happend (from Explorer and other Browser)
the css http://static.dhkeno.ru/css/css_en.css

EDIT
Note this site is Gambling related and may trigger “Adult” filters

4

Hi,

The first thing you should know is that form controls are vastly different cross browsers and you will never get them to look the same especially with the new html5 inputs.

There are just some things that can’t be changed so you will have to live with that. For inputs and selects you should give them a width in css so that they are at least the same width.

You also have missed off your units (px) from one of your column styles resulting in the column sticking out of the side of the page.

        .tn5{width:900px}/* you had missing units here*/
        #count_tickets{width:75px}
        #amount,#price{width:65px}
   
 /* remove arrow from select in ie11*/
    #price::-ms-expand,
    #amount::-ms-expand {
        display: none;
    }

Those are some simple tweaks to get some of it back on track but what you should be doing is checking as you go (firefox is different also) and then adjusting the design for a best fit in all rather than trying to make it work in just one browser and then realizing it doesn’t fit in others.

The extra space in IE is because you have used double breaks just to make space and you should never do that. A break (
) determines an end of line (not an end of paragraph) and shouldn’t be used just to make space. Use margins/padding to make space between elements.

1 Like
5

Wow, thanks you very much, now work very good )))
Just one more help with input[type=“range”]

I need to do, to look like same on all browsers http://jsfiddle.net/x3qbqLga/

Thanks again )

6

You can’t do that with css I’m afraid because all browsers render this differently. Some of them like ie11 have a completely different look altogether.

You need to remove the margin to stop Firefox sticking out.

.inrange {margin:0}

The only other option would be to use a javascript range slider instead.

1 Like
7

Thank you. I see you are very good know css )))