background preloader

Css

Facebook Twitter

Software: fixed.js. Fixed positioning According to CSS level 2, an element can be positioned relative to the browser window using the style position: fixed: it does not move when the page is scrolled. You can do nice layout things with this in most modern browsers - but not on IE for Windows. Unless you use this script. Fixed backgrounds According to CSS level 1, an element’s background can be positioned relative to the browser window using the style background-attachment: fixed: the body of the element acts like a window onto the background image, which stays still when the page is scrolled. Using fixed.js This script makes these CSS properties work correctly in IE/Win version 5.0 upwards. And add whatever fixed features you like to your stylesheet as normal. Caveats IE still doesn’t know that fixed-position elements should not make the window bigger. Don’t put loads of fixed position/background elements on a page - it’ll get slow for many users.

Latest release Version 1.8: module, example page. CSS Vault » The Web's CSS Gallery & Site. Applied CSS Management and Optimization. In Discussing CSS Management and Optimization we looked at some of the methods used to code and manage CSS, and saw that taken together they could result in a lot of code spread across several stylesheets. In this post we will look at some methods for dealing with that extra code and those extra http requests. Before we get into the good stuff, a few little notes about dynamic CSS, something used in a few of the ideas discussed below. Dynamic CSS Many people are toying with the idea of dynamic stylesheets by doing some server side magic with their CSS by parsing it (with php, asp etc.) before it leaves the server for the client.

As we will see below, this helps to offset some of the issues that arise from managing stylesheets that we discussed yesterday. Be careful! One thing that I cannot stress enough about dynamic CSS is that you do your homework first, and by this I mean test your stylesheets, make sure that they cache properly (see 'Does it cache? ') Check your cache! Hack management. Luminis: Forcing CSS/JavaScript Updates to Clients : BorkWeb. [[innerindex]] Introduction I gave a talk at SunGard Summit in Anaheim this spring on Plymouth State‘s portal (myPlymouth). There were a number of really great questions that came up following my presentation, one of which is the topic of this post: “How do you force a client’s browser to always use the correct version of CSS and/or JavaScript in Luminis?” When upgrading Plymouth State’s Luminis installation from III to IV, we had to tackle this same issue and after banging my head against the wall a number of times, I found our answer.

Ensure that the JavaScript and CSS that is being served up to our users can be cached by their browser in order to optimize their download speeds.Control when a user’s browser has to re-download a new version of the code.Do the above within the bounds of the very restrictive caching provided by the Luminis product. Step 1: Basic Browser Caching That didn’t work for me. All of these files could now be cached by users’ browsers. Start of a Solution: load.js. Can We Prevent CSS Caching? When you are developing a site, there is a heck of a lot of "refreshing" going on. You start to get a pretty good feel for what your browser is going to pick up on a single refresh, and what it won't. For example, I find that if I over-write an image file on the server, it will take me two refreshes for that image to update on the live site. Then maybe I'll pop over into Opera and see how the site is doing over there, only to find on the first render of the page that is a really old version.

Uh oh. Refresh. That's fine for you, you are used to that kind of thing. Can we solve this? Timestamping Your CSS There is a little trick that I believe comes from the land of JavaScript programmers. I did a quick test to see if this kind of tomfoolery would even fly. <link rel="stylesheet" type="text/css" href="style.css?

Which results in this: Alter that date format as needed. I haven't done any hardcore testing of this, but my early tests suggest that it works pretty well. Update Share On. Centering Div for Firefox vs IE -- Blog Sahat Tambunan. Sudah lama nih gak bikin css baru dari awal, kebetulan hari ini mulai buat template untuk kerjaan. Hal yang sudah lama gw temuin dan gw pake tiba2 jadi lupa lagi solusinya. Yah, namanya juga manusia. Mau share aja buat yang mungkin mengalami kendala yang sama, ada saatnya kita ingin memiliki template dengan lebar yang tidak memenuhi browser, misalnya berukuran fix 780 pixel. Pertanyaan berikutnya yang datang saat itu ialah, template kita itu dalam browser ingin terlihat berada di kiri, tengah atau kanan? Secara default template kita akan berada di sebelah kiri.

Lalu bagaimana kalau mau ditengahkan? Kendala pertama, IE (ver 6) tidak bisa mengaplikasikan style width pada tag body, sementara Firefox bisa. Gampang kan caranya?