Scenic Living | living with a view on life

CAT | css

May/09

12

z-index problems in IE7

While developing I use FireFox as my main browser. Mostly during the end of the project IE bugfixing is scheduled.

Today I was having difficulties (again) with z-indexes in IE7. Solution? Very easy using jQuery…

Just have this in your script and it will be okay:

$(function() {
	var zIndexNumber = 1000;
	$('div').each(function() {
		$(this).css('zIndex', zIndexNumber);
		zIndexNumber -= 10;
	});
});

Wanna know more? Read the article that brought me my solution!

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

, ,

Oct/08

5

Stylence is launched!

Weel – it took a while to achieve this through all other work, but we finished it enough to have it launced: Stylence – for internet and TYPO3 development in style! There is a lot to improve. But you have to start in order to improve right?!

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Jul/08

31

IE6 PNG issues

I haven’t tried this one yet – but according to what they promiss it must be great.

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Ever needed to use a different class for a first element in a column? And a specific one for the middle elements and – making it the royal treat – one for the last element as well?

I have been wondering about this for a while – tested some stuff here and there and finally I came up with this solution. I hope it will be helpful to you in one of your projects as well!

tt_content.stdWrap.outerWrap = |<div style="display:none;"></div>
lib.contentBar = COA
lib.contentBar {
10 < styles.content.get
stdWrap.split {
token = <div style="display:none;"></div>
cObjNum = 1||2 |*| 3||4 |*| 5||6
1.current = 1
1.wrap = <div class="first">|</div>
2.current = 1
2.wrap = <div class="middle">|</div>
3.current = 1
3.wrap = <div class="middle">|</div>
4.current = 1
4.wrap = <div class="middle">|</div>
5.current = 1
5.wrap = <div class="last">|</div>
6.current = 1
}
}

Questions? Leave a reply!

Have a better solution? Leave a reply, please! ;-) I especially do not like the splitter part, because of the extra code. I used ###SPLITTER### at first, but that left me with a ###SPLITTER### marker on the pages I didn’t use the replacement…

There must be a better way – so please! ;-)

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Let’s go down to it right away:

  1. Open your main (plugins) template in Typo3, in full glory (you can figure out what that means!)
  2. Add in the ‘Include Static’ section: plugin.alt.print (98)
    1. this adds the page type 98 to your site
  3. Now  you can use the constants to add some special cs/html to make it feel the way you like it to be
    1. plugin.alt.print.file.stylesheet = fileadmin/templates/res/print.css
    2. plugin.alt.print.file.template = fileadmin/templates/print.html
  4. Now add the following code in the TS where you built your (footer) menu:
    1. stdWrap {
      append = TEXT
      append.value = print
      append.typolink.title = printversion of this page
      append.typolink.parameter.dataWrap = {TSFE:id},98
      }
    2. This will add a link entitled print to the menu and will generate the correct pagetype.
  5. This works with SimulateStatic (print.34.98.html) as a charm!
  6. And why not with the rest? It will!

Have fun!

Consider a donation if blablabla ;-)

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

, , , ,

Ever wondered why IE shows bigger headings than other browsers? If you are like me and walking your website releases the FF – Safari – IE7 – IE6 way, you’ll notice fontsizes are screwed up here and there. Of course you can write different stylesheets, what I did for a while. But recently I ran into this article that actually explains a good deal how to get stuff right, the nice way.

Enjoy reading!

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

, , , , ,

We all know this is considered good SEO strategy, but going around Typo3 we have to tweak it a little to do what we want it to do.

What we want to achieve is:
1. a page title (the title tag) with the name of the company & the title of the page
2. a h1 tag on the page doing exactly the same, but which is displayed as the company logo
3. make sure customers while adding content not setting default h1’s on the site (1 should be enough ;-) )

Getting #1 down:
- this will work out of the box, as long as you fill in the sitetitle field in the template (there are ways to alter how this is displayed of course, some using typoscript, some using php or an extention)

#1 is down..

On to the second one!
- make sure your h1 tag in your html template is marked as a typoscript object (when using TemplaVoila) or have it parsed as a marker (automaketemplate, autoparser)
- put the following code in your typoscript:
lib.logo = TEXT
lib.logo {
dataWrap = {page:title} — PutTheCompanyNameHere
}
- the logo object is placed inside the h1 tag
- give the h1 item the logo
- use CSS to have the span inside h1 not to be shown and voila!

#2 is down as well…

To make it real hard in the end – we need #3 to go down as well…
It’s a though one. Hard to understand. I hope you can follow this:
- go to your TS template
- go to the constant editor
- select content and
- set ‘default header’ to 2

That was it. I hope this was helpfull, if you have questions leave a comment. If you found it helpful: leave one too! :-)

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Sep/07

24

sIFR and Typo3

I have been asked today to get fonts compiled to use with sIFR. To be honoust I didn’t know what was expected of me and after a little conversing it became clear: to use the extention gb_sifr you need to have a .swf containing all the characters of the font you want to use.

After some research I found OpensIFR; a tool to create the needed file. In less then 10 minutes time I was able to produce a list, nice looking, sIFR replaced and all. Nice.

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Sep/07

24

Getting it on your mobile…

I read this post on how to do some work on getting your site mobile friendly. Great post. Must read. http://www.mikeindustries.com/blog/archive/2005/07/make-your-site-mobile-friendly 

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Sep/07

11

CSS en Tables…

A short tip:

don’t wrap first cell’s using something like:

td.firstCell { white-space: nowrap; }

Share and Enjoy:
  • Print this article!
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • eKudos
  • MisterWong
  • Reddit
  • Technorati

No tags

Older posts >>

Find it!

Theme Design by devolux.org