I designed a page using Drupal 7 ( http://quaaoutlodge.com/drupal-7.14/ ). It looks just fine i(the way I meant it to) in Firefox anf Chrome but in Internet Explorer (testing 8.0 on WXP) it is all messed up. Now if you go onto a page with sub links, Golf e.g. ( http://quaaoutlodge.com/drupal-7.14/golf ) it looks all like expected in FF and Chrome but in IE, the #ContentWrapper div only starts on the bottom of my "secondnav" div. Why is this? How do I get the content up so that the top of content aligns wit the top of secondnav?
Okay, in the mean time I have figured out that if I add
width:600px;
to my
#contentWrapper{
style definition, the content div jumps up and its top is aligned with the top from the secondnav but this is not what I want. I would like to keep content at 800px and have them both next to each other, any hints?
Thanks!
Okay, fifured it out. An underlying div #pageBorder had a
margin-left:220px
and that would push my content onto the next line in IE while it worked fine in FF and Chrome. Well, it's fixed now...
http://quaaoutlodge.com/drupal-7.14/?q=contact
Related
Heloo.
I have problem with multiple DIV elements in google chrome. if those have display:inline-block, sometimes chrome still keeps breaking line. Everything works fine in Firefox, Opera and IE, but not in chrome.
try visiting this page:
http://tridex.pl/kategoria/%2A00/Nowosci.html?typ_listy=4
This is shop. There are 2 similar item layout styles, one with 3 items in row, one with "as many as will fit on your screen" in row. Everything works as it should in Firefox, IE, Opera... but Chrome displays 2 items in first line and 3 in each another.
Layout is modified on the fly, so maybe this is the problem? But since it works in all other browsers, why it does not in Chrome? Should i call something to tell Chrome to recalculate DIV width and rearrage those?
Does anyone have any idea how does it work in Chrome? Is there something else i should
Setting the width style of the parent element a bit wider helped me, looks like the elements need more room in Chrome.
It doesn't work for me in Firefox either... however this seems to be the issue.
<div id="prawy_div" style="width: 564px; left: 273px; position: relative;">
If I change its width to what it starts out as... 680px, Everything looks fine. A script is changing it for some reason, and boy does it want to change it... seems to be attached to your scroll event.
I'm working on a new website design and everything seems to be working on chrome, yet on internet explorer (only the newest version, it seems), there is a ton of white space added on top of the website.
Basically on IE, it almost looks like I had 500px of padding-top. But it displays perfectly on chrome.
The current URL is cspclaw.com
Thanks.
I posted the entire main page HTML here: http://pastebin.com/eDmfuRWK
And the entire main page CSS here: http://pastebin.com/GK3TRtx4
Seems to be an IE bug to me.
It calculates the height of the <tr> through the height of the contents of the highest <td>, disregarding the rowspan="2".
If you remove the rowspan attribute, you can kind of see why it's doing what it's doing.
The problem for IE is that every single <td> in your second row (the row containing the <div class="fadein">-cells) has rowspan="2". Remove that, and the page will no longer show that odd margin/padding in IE.
It still doesn't look the same, my guess is more rogue rowspans... :)
Currently, my site works perfectly in Firefox, IE, and Safari, but one portion does not work in Chrome.
Take a look at: http://tinyurl . com/chxg2tb
The table at the bottom expands beyond the content border in Chrome, instead of expanding the border like in Firefox, IE and Safari.
This has me stumped because usually errors like these happen with Firefox and IE working fine, and then the webkit browsers don't work, but in this case it is just Chrome.
For some reason the table doesn't expand the parent div, and I don't know why.
The only thing I could think of is something with overflow, but I haven't been able to get it to cooperate.
thats NOT the best solution but you can just create a div that wraps the table and set the div css like this:
height: 120px;
A sign up page on my site is giving me trouble this evening. It shows up fine in all of my macbook pro's browsers(FF, Chrome, Safari), but when I view it in FF on a PC it seems the page somehow breaks- the horizontal layout becomes vertical. Any ideas why this may be?
Viewed in FF on macbook pro-
Viewed in FF on pc-
If this site is online maybe you could post a link to it, also it would be useful if you could post the html and css.
I'd put the left hand content and right hand content in 2 divs with say the left div 40% and the right 50% then float the left div left and the right div right. Alternately you can absolute position the divs.
Please try to remove position:absloute; for left and right div's. it will work. position is not required any way your make float left and right for two div's with proper width so position is not required.
Yes because of position:absoulte; only the problem occurred. try to remove position.
I've been searching about this issue for a couple of days. But as the problems are spesific, so the solutions usually are. My problem is kinda common but the solutions I found so far didn't work for me.
I use a #header div which is around 30 px height. Under that div, I have 3 divs like left, center and right. I have an accordion menu with js in the left div, content place in center, and last tweets script in the right div. Since I added box-shadow to #header div, other div's under it are placed after where shadow ends. I used z-index to make header div's shadow place on other div's, and it works perfectly in Firefox, Safari, Chrome, even IE9! But when I try in older versions of IE, it just happens the way I tell. Here is a screenshot: http://www.twitpic.com/4kh9w3
Like I just said, I have "last 2 tweets" script in the right div. It fills < ul> < li> items with tweets and shows them. So that I can design this list in my css file. And same, it only doesn't work for IE7&8. I don't even mention 6, it's not so important. The problem is that IE automatically scrolls list items to left. So half of them disappear! Here is the screenshot: http://www.twitpic.com/4khajz
So, what can I do to save my view in Firefox, Chrome etc. and also can fix it in Internet Explorer 7&8?
I'm not sure if i understand your problem... but if you cant get shadows to work try looking here http://css3please.com