Archive for the 'YAML' Category

How to use position-absolute and z-index with Internet Explorer 7 and nested containers

When you have a div-container which has the attribute position-absolute and you put a 2nd div-container inside (which has also a position-absolute attribute) it can happens that Internet Explorer 7 does not interpret this correct.

I had the problem, that the 2nd div-container (which is a fold-out CSS-menu) is larger than the sorrounding div. In IE 7 the CSS-menu lays, in the part outside the sorrounding container, behind those elements. But for a menu you aspect to be the first element in the hierarchy.

Those layer positions can be set using z-index in CSS. The higher the index, the higher the position of the element to users-view. So I set the z-index to a high value but in IE 7 nothing happened.

Continue reading ‘How to use position-absolute and z-index with Internet Explorer 7 and nested containers’

How to code a jQuery slider menu

How to …

I show you a nice jQuery snippet for a smoothy slider menu.

This was my first jQuery experience – if you find some tuning options, tell me please!

Here you can see my script in Action: http://www.gyn-endoskopie.de/

Continue reading ‘How to code a jQuery slider menu’

How to build a YAML fullscreen layout

How to …

Yaml provides a nice solution for column layout, center layout and fullscreen layout.

The last team-noir project was a fullscreen-design for our customer. I show you how easy it is to code such a template:

Continue reading ‘How to build a YAML fullscreen layout’

Using YAML and be fully variable

I´m using YAML now for a while on our projects, also at work and for my own website. YAML is build as a core version which has many hacks (maybe for IE) and is made as an 3-column layout. On top of this there are some files which overwrites the other CSS classes and IDs and this is your special layout. Maybe when you use the YAML-Builder you have a finished layout where the classes in the css-directory overwrites the core classes.

For example you want to have a 2-column layout instead of a 3-column one the files in the css-directory set this layout. But when you make your own website you have to overwrite also some settings in the css-directory because you want to change the YAML-layout a bit. Layout, sizing or colours. There are two ways to do this.

Continue reading ‘Using YAML and be fully variable’

How to … center a YAML Layout

How to

Some Layouts must be centered in your browser display. You can use several ways – i will present here my “best practice”

We use the CSS Framework from Dirk Jesse ->YAML . The author includes a horizontal alignment with the following code:
Continue reading ‘How to … center a YAML Layout’

How to … integrate a YAML Menu to TYPO3

How to

If you want to use YAML with TYPO3 you will need some code snipptes for the HMENU in TypoScript. I have made my own structure, let’s  have a look …

First tell TYPO3 where the Menu should be appear, you can do this with ###MARKERS### in your template or use TemplaVoila (lib.menu).

Continue reading ‘How to … integrate a YAML Menu to TYPO3′