Heyall,
For a few days I have been getting the following problem:
screencap
The image shows two bars. It only is shown like this in a built version of Cordova on iOS or Android. Not in if ran in the browser, so I can't inspect the attribute.
The second bar (with no caps) is the select attribute. What the first bar is, God may know. But God hasn't yet been so kind to tell me. Does anyone know why it is there and is styled as is? Even without any css it still shows. I only want to show the second bar, obviously. But the first one won't disappear. It always shows the selected option of the select below.
I have tried 'cleaning' the css of the select (Reset/remove CSS styles for element only) but this hasn't worked. Also assigning select:before other properties won't work.
Thanks in advance!
Okay I have been able to solve this by removing jquery-mobile v1.4.5. How exactly jquery-mobile caused this problem to occur, I don't know. But by exchanging jquery-mobile by fastclick.js I do get the functionality I want, but without the bugs/unintended features.
Related
I have a strange behavior with drop down lists and button in my layout.
I have just made a fiddle here to illustrate how this looks like.
As you can see in the example, if you resize the browser the you can still open the lists or click on the Filter button which is ok.
When I do the same on my desktop, the first list will work properly, but the second and third list will not open as well the button in not clickable anymore.
I have spent the all day trying to fix this issue, unfortunately with no success at all.
Maybe someone of you guys have had the same issue or knows what is going on here?
Any help will be much appreciated.
I've encountered issue like that before when wrapper elements were stretching over other elements via zindex and couldn't track it down until i gave each element a background color and could see how they were transforming in size as i adjusted the window size.
I'm a newbie and I have tried hard to get out a page.
After many trail and error this page finally looks "ok" though some of the part I don't know how I get it "right"
But when my page is opened in Firefox its bloody twisted! the table jumped out of boundary.
here is the format in chrome and IE(which is right)
and this is the format in firefox
the table shift out of the container and shift up.
I've search about use css reset but I dun't know how to do it,(what should I add to where)
or I should edit my html or css?which part of css I need to edit?
thanks in advanceļ¼
I have solved this by put all shifted table into a container to fix them.
and it works! thanks guys for helping me.
I have 2 selection boxes states and cities, On state selection change I am writing a java script to display cities of that respective state by hiding rest of the cities. The problem is, height of the selection box dropdown is getting effected in chrome where as its appearing fine in firefox.
Is there a quick and proper solution for this?
i found a solution to this problem in this post myself
Height of an HTML select box (dropdown)
maybe you can check that one out. it helped me out a lot and i hope it helps with your problem aswell.
As i just saw there is a kind of dublicate Question right here
<select> HTML element with height
It got some good Ideas too. But i didnt check them all so far. Maybe you can find something in that post too
On my home page in ie for some reason it makes a line about 3px high right about the content and right below the bread crumb bar. example.
Second problem, is that it also makes a box on this page
example
On the second example it messes with the user photo moves it into a box that should not be there. Along with the follow forum button. Which should be right below in the box as well. To see how it should look check those pages in any browser but ie. I really could use a fix for this. If its a css thing i have a ie specific css file i can put code in i just cant figure out what i need to put in there.
Also can someone check it out in ie 8 because i don't have it anymore and if there is a different fix maby you could help with that as well.
Looks like you have something going on that's changing your HTML or your DOM based on the browser. Likely you either have some client or server side code that manipulating things in a browser-variant way.
For example, in IE you have two DIVs with ID "boardindex", but I only see one in Chrome. Use F12 and/or Firebug to further investigate the differences. Isolate the code that's causing the differences using a binary search method if necessary.
I have this CSS Menu. It's fully functional.
But when I put it in my page inside some table cell, it blows up like this. Don't mind the silver and the blue lines, they are from the page.
Now I have debugged the page and the menu itself. No error still this weird behavior. Then I got another menu and put that in here and it showed the same error. Any idea why is this happening?
I could paste the code but I don't think anybody is going to go through 500 lines of HTML and 100 lines of CSS.
I am using the latest Firefox. IE6 shows the same behavior.
check the code here...
CSS Menu Independent in a page
CSS Menu Inside a complex page
Your "in-place" stylesheet is much longer than your "minimum" one, and contains rules that are changing the layout. In particular, do a search for "280" -- you're setting some widths to that.
In some browsers, tables get some default styles that are not what you expect. I can't recall right now, but I think one of them was align="centre" by default.
Maybe try setting the table attributes to what you want them to be explicitly?
W3Schools for table attributes.