Vertical Sprymenubar Internet Explorer problems

HTML & CSS
21

webkit doesn’t seem to like that table next to a float and stretches to 100% and therefore drops to a new line.

You will need to add amargine-left to .content and then nest an inner element with a 100% width.

e.g.


.content{margin-left:270px;overflow:visible}
.inner{width:100%;overflow:auto}




<div class="content">
  [B]<div class="inner">
[/B]	<table id="tabelhome">
....   
        </table>
   [B] </div>
[/B]</div>

I’m not sure why you needed a table anyway and a couple of floats would have done. As it is it doesn’t really scale well because its more of a fixed width design that you have. If the right column was floated it could drop under the image when squeezed but a table won;t do that.

22

Yeah I used a table because a friend of mine always said: In a container if you need wo colums, easiest to work with is a table, they are much more easy to make the layout and they will never interfear which eachother and you don’t get float problems and stuff. In the future I will stick to entire divs, if that is the best solution?
Nonetheless the screen-problem and making it smaller, my header still isn’t 100% correct when shrinking the screen. It’s like he makes my header all of a sudden 500px high, and my content is floating into the header… If anybody would care to take a look here I posted a temporarily link to the site: http://www.maxx-it.be/Aanbod/Webdesign/Mira%20Site/Mira/sweetfruits/index2.html…

Then I have a bigger problem, and more related to the above posts: I implemented the plugin of jquery.cycle.all.min.js as suggested above (http://line25.com/tutorials/build-a-simple-image-slideshow-with-jquery-cycle), but now it appears, I can’t add more then 13 pictures to the gallery. The gallery works with over 13 pictures, but the prev/next buttons don’t appear anymore and don’t work. So I was wondering if anyone knows the explanation and solution for this?
I rechecked everything and I’ve got it on multiple pages that over 13 pictures you can’t press or see the next/prev buttons!
Thanks alot!

Kind regards
Maxx-iT

23

Hi,

You could set the mi-width a bit larger to stop the layout form breaking.

e.g.


.container {
    background-color: #FFFFFF;
    box-shadow: 10px 50px 100px #4E1B1A;
    margin: 0 auto;
[B]    min-width: 600px;[/B]
    width: 75%;
}

There’s not a lot you can do with the way that its structured and that type of design which looks more suited to a fixed width.

Regarding the jquery then you should post a full example in the JS forum detailing the problem and what you have tried etc.