Im trying out the cms cms made simple It has a css menu thing which allows you to have submenus and you can make

first-letter things like this

no.. they're pseudo-selectors and pseudo-elements

aye
a ruleset would be something like this
P{ text-indent: 10px; }

a selector = h3 or div or p
I don't think that's called a ruleset.

I seen it on this example when reading
http://www.hwg.org/resources/faqs/cssFAQ.html#ruleset

Forbidden, read chapter one of CSS specs!

ah, you're right then.

Zoffix, where would I find that chapter?
Zoffix, I am new at css and trying to learn it

~_~

sorry

First URL in the topic FFS!
Forbidden, http://www.zoffix.com/new/dynamic-style-change.html

I thought you said not to use js

~~_
dumb

or only use it when selecting class names

Don't do any CSS related business host in JS.

not dumb, just ignorant to css
ok

How the hell does it mean "don't use JS"?~!

sorry I got ya now
Zoffix, looking at your example, what does p #on, do
I understand teh moo #off moo #on

~_~
/ignore

why ignore… nevermind then man, I was just trying to get an understanding

'p #on' means something with an id of 'on' which is a descendant of a

ok so you have to start from the parent level to activate a child of that parent

Err, what do you mean?

basically with his example I can't just do .moo #on since it is inside of another attribute
I have to reference the p first and then what is under it

ugh
]css select @ Forbidden

Learn how to apply CSS Selectors: 1) read: http://w3.org/TR/CSS21/selector.html , http://css.maxdesign.com.au/selectutorial/ 2) try it out: http://gallery.theopalgroup.com/selectoracle/

]schools @ Forbidden

schools: Explore the intricacies of HTML and CSS here: www.blooberry.com/ , www.htmlhelp.com/ , http://css-discuss.incutio.com/ , www.brainjar.com/ , www.htmldog.com/ , http://css.maxdesign.com.au/

Zoffix, thought you had me on /ignore

Zoffix's /ignores are all mental.

aye

element?

cernui, you can't do that ~~_~

Zoffix, ok you have an off and an on in the same P, what if I only have one id how would I turn off/on the 1 id?

~_~
Same way as I change the padding and background on maybe?!
Stop talking to me…

* html .tiddler {height:1%;} — anyone got an idea what that might be a fix for (I know, it only applies to IE)

Ace_NoOne, don't use that
]z hl @ Ace_NoOne

IE hasLayout: http://haslayout.net/haslayout.shtml

it's not my file
that's why I'm asking
1%; might be good for

IE hasLayout: http://haslayout.net/haslayout.shtml
a href="http://haslayout.net/haslayout.shtml"http://haslayout.net/haslayout.shtml/a
a href="a href="http://haslayout.net/haslayout.shtml"http://haslayout.net/haslayout.shtml/a"http://haslayout.net/haslayout.shtml"http://haslayout.net/haslayout.shtml/a/a

there is no occurrence of 1% there

Because they've been burgled

Ace_NoOne, is there an occurrence of height there?

so this just activates hasLayout?

YES!

Setting height or width or something (anything other than auto) causes hasLayout in IE

]z ie extraheight @ Ace_NoOne

IE Extra Height Bug: http://haslayout.net/css/extraheight.shtml

oh right, of course - silly me
thanks for that Zoffix

Put those together and you'll get the point

0 more like min-height:0, height:0 is a good trigger for hasLayout
As long as overflow isn't set to something
Honestly, I don't know why people use 1% instead of 0

Not talking to Zoffix, anyone else… When I mouseover to show the second nav, I change the position to static, this shifts the first nav to the size of the second nav, should position be something else?

heh
"not talking to Zoffix"?

He said to stop talking to him

Nanobot, ’cause it's teh Holly Hax!!! :P ~

Zoffix is the resident God

I agree
but he said to stop talking to him

hax won't work in IE 7…

Beware of IE 7. In IE 7, using the height property for hasLayout will cause problems. Give IE 7 min-height:0; instead

good to know, thanks

heh

as I've said, this is not my file

Zoffix, are you willing to still help me?
Please?

You would differentiate between IE 6 and IE 7 via "* html" or conditional comments

or just {zoom: 1;} in condcoms.. or just {display: inline-block;} {display: original;} if your name is reisio

lol

reisio is a funny man

Zoffix, ok I think I have it the way you wanted me to do it. Can you look at it now and maybe tell me why the first level shifts when the second level shows, please

hey guys, does anyone here know Rewrite rules?
RewriteRule ^usercp usercp.php but it works both for www.domain.com/usercp and www.domain.com/usercpsfsdçfsdfsdfjsd. It will work as long as the www.domain.com/usercp is there, no matter what is after it! How do I fix it so it only works for www.domain.com/usercp and www.domain.com/usercp/ ?

demio, yes.. but you are in the wrong channel!
demio, /msg fajita mod_rewrite

i also asked it in #apache :P

demio, stop cross-posting and stop asking off topic questions.

what are you, the IRC police? :P

Zoffix, sorry if I offended you in anyway. But can you please assist me. I followed what you said and go to where I am so far. Please help.

demio, YES
demio, RewriteRule ^usercp$ usercp.php

thanks
what does the $ mean?

Zoffix, come on man…
$ means it ends there

demio, RewriteRule ^usercp$ usercp.php [L,QSA]
demio, end of string anchor

sweet
thanks
do I also need to add RewriteRule ^usercp/$ usercp.php for the www.domain.com/usercp/ to work? or is there another way

Zoffix?

demio, this is #css!

I asked in apache and no-one answered :/

So google and read the docs!

so be nice
oh cmon, this is an easy question :/
-_-
*sigh*

demio, here ya go
http://httpd.apache.org/docs/2.2/misc/rewriteguide.html
http://www.bloghash.com/2006/12/apache-mod_rewrite-examples/
that should help you do what you want
demio, can you ask Zoffix, if he has me on ignore and if he can turn it off please

thank you

np

do you have Forbidden on ignore?

hello

Zoffix's /ignores are all mental.

Forbidden, you don't know how to walk but trying to run in Olympics… how can I help you. Learn the basics first.

Could anyone suggest tips for my webpage layout?

You are trying to do 3 level drop downs but don't even know the terminology and can't follow simplistic code examples.

yay i found out how to do it ^^
RewriteRule ^usercp/?$ usercp.php
What does that /? mean? I mean, technically speaking

0 or 1 "/"?

Zoffix, I am trying to do the first two levels first.

So it matches 'usercp' or 'usercp/', I assume.

hmm, yea that's what it does

Anyway, sleep time. Night.

cya

demio, RewriteRule ^(([^/]+/)*[^./]+)/?$ /$1.php [L,QSA]

?

Zoffix, what am I doing wrong. I believe I have done it the way you suggested
I have tried display:inline on the li

I don't want that rule hehe
it's too general
I have some 30 rules in this htaccess file

Does anyone have access to IE right now who wouldn't mind having a quick look at http://www.whywaitwebs.com/ and telling me if the flash appears?

on my IE6 it does

ie7 - ok

Thanks

oh god it's beautiful http://www.ruby-lang.org/en/

the site? or the language

site
language is interesting too

lol
What's so great about the site

it's so pretty 3

lol okay

heh
# The famous Hello World# program is trivial in# Ruby. You don't need:## * a "main" method# * newline escapes# * semicolons## Here's the code: puts "Hello World!" I guess the real problem starts when you do NOT want to print the trailing new line

Yeah

Lol why "puts"

I guess that's from C++

I'm reading through some docs and every time I see puts I imagine Gollem/Smeagol saying it lol

"Put on STDOUT"

O really. Well I'm a n00b.

that's floated to the left, that serves as a navigation sidebar. I have another div with a margin set to be positioned to the right of the sidebar. Everything's nice provided that content in the "main" div is longer than that of the sidebar. When the stuff in the sidebar is long, it overflows into the footer and below of the page, so its pretty ugly. Is there a way to automatical

ly make the height of the main div greater or equal to that of the sidebar?
http://kc9ddi.us/css-ex.html

yes
hidden; on the main div
er. wait ni
]fullheight

DECENT: http://phrogz.net/CSS/valign_in_body/block.html LAME: http://www.alistapart.com/articles/fauxcolumns/

pm2, #footer { clear: both; }

you could use javascript.

Zoffix, have that already - my bad - the footer is pushed down, but there's a wrapper div that makes a box that both the sidebar and main div live in, and the sidebar extends past the bottom of that box

pm2, #box {overflow: hidden;}
]clear @ pm2

Contain floats: http://www.ejeliot.com/blog/59 , www.positioniseverything.net/easyclearing.html

hi! I have two divs (left and right) in a container div
the right one is fixed

Congrats.

Zoffix, this is exactly what I was trying to do with the first two levels, I have to use js to reposition the second nav so it doesn't run outside of the layout and also to get the size of the second nav childs to set the ul overall size to get it to go inline — http://phpdev.gotdns.com/menu2.php

Zoffix Well, I don't really want to hide the overflow, I want to expand the main div/wrapper box to fit the sidebar

the left should expand to feel the space of the container
how can I do this ?

JD__, how would a javascript hosting work

pm2, did you even try that code? Learned how overflow works? Learned how it affects floated elements?

I tried 100% width on the left one but it has moved down the right one

I think he might mean he wants two columns to match height

yeah

Zoffix,is there anything wrong with what I have?

JD__, pm2……. and the sidebar extends past the bottom of that box

and it validates

yavor, right{float: right;} left{overflow: hidden;}

Zoffix, yeah, that's the problem

pm2, I told you how to fix it… but yeah, you are an expert and you don't want anything…
upm2, I told you how to fix it… but yeah, you are an expert and you don't want anything…/u

Ah, you were right, it is a floaty

Zoffix, I'm not trying to be a jerk, but I'm just not following you…

Zoffix, and what should be the left width ?

is your problem that your floated object is extending outside of its container?

yavor, did I say anything about width?

JD__, yes

pm2, #box {overflow: hidden;}

If so, set overflow: hidden; on the container, and width: 100%; (if it doesn't have a width value already set)

Contain floats: http://www.ejeliot.com/blog/59 , www.positioniseverything.net/easyclearing.html

Zoffix, no but I tried it and it's just the same as before

trust me on this one, it is css magic

pm2, no need for width.. IE needs layout and you don't have to use width to set it to true
]z hl @ pm2

IE hasLayout: http://haslayout.net/haslayout.shtml

1;

JD__, the overflow:hidden; worked (in firefox, anyway…) thanks

np

JD__, how about display, height, float, overflow, min-(height|width), position, etc. ?

Zoffix, but why should I use overflow at all ?
the problem is that I can't make the left div to feel the space

I am having an extremly hard time getting the links on the left side to be evenly spaced on all the pages. http://philley.freehostia.com/index.php also /mypage/showstats.php and /mypage/info.php works just fine. append a .txt to thoes three files to see the code. http://philley.freehostia.com/mypage/showstats.php.txt is where the problem lies i think.
lemme fix it so you can see the code.

Zoffix, looking at what I have so far, I tried to add this —
li#sub_5 .msHover #navSubMainSub_1 {
position: absolute;
left: 0;
z-index:600;
}
damn sorry
frigggin

….

paste BS
sorry Zoffix
that was an accident meant to paste url

Forbidden, 1) get a real client. 2) Stop bugging me. 3) Bugging me will only get you on my black list, flooding will get you banned.

Ok

http://philley.freehostia.com/index.php - Anyone have an idea as to why the showstats page's links are messed up on the left. css @ http://philley.freehostia.com/digiaqua.css
replace .php with .txt to see source for index.php , info.php and showstats.php

Zoffix, please help

Hey guys, I want my body to 'extend' all the way to the bottom of the visible area, so that when I have a baackground image hosting anchored to the bottom it's actually at the bottom and not halfway down the visible area.

I am trying to make this design but the reversed way
I have a right menu not left
and it always shows on a new line right after the left

Vixus, html { height: 100%; } body { height: auto!important; height: 100%; min-height: 100%; }

i was also curious, what does !important do in CSS?

Vixus, it's an IE 7 hack since it doesn't support min-height and thinks that `height` is min-height

ok, so no space between auto and !important

auto; since !important adds more specificity to the rule, but IE 7 is stupid and will take the following height: 100%;

cool

Vixus

thanks.
works a treat.

can someone help me with an ie vs firefox/safari issue re: equal column sizes?
http://www.zerosum.org/~nap/test.html
length of the 'main' column should always be longer than the height of the sidebar
works fine in safari and firefox
but doesn't work in IE

]sameheight

http://www.positioniseverything.net/articles/onetruelayout/equalheight http://www.alistapart.com/articles/fauxcolumns/

$

Failed to reach http://www.zerosum.org/~nap/test.html

uh…

_ZofBot3, reload config
ugh
_ZofBot3, restart

is there a way to apply a css-property to all the h* elements? so i don't have to say: h1{…} h2{….} h3{…} etc

bottiger, no

the faux columns doesn't really apply to my situation

bottiger, h1, h2, h3, h4, h5, h6 { }

okey - thanks

and i couldn't get the one true layout to work
already looked at both of those links, sadly

]css select @ bottiger

Learn how to apply CSS Selectors: 1) read: http://w3.org/TR/CSS21/selector.html , http://css.maxdesign.com.au/selectutorial/ 2) try it out: http://gallery.theopalgroup.com/selectoracle/

was thinking it must be something simple (misplaced clear or something)
if someone could just spend a couple minutes to take a quick peek that is
in fact, the one true column concept seems to just clip off the longer column in ie, which is ah, strange…
hrmm

just means you did it wrong, or the template wasn't designed with the version of IE you're using in mind

yeah, obviously. hence the 'hrmm'

Hi folks. I'm trying to organize the content of this page via: http://paste.css-standards.org/21907
Guess I need to read up on my div placement, heh

would specifying a height in a contained element create that clipping problem? i'd think the container would just expand to fill
http://www.zerosum.org/~nap/test.html if someone wants to analyze why the 'equal columsn / one true layout' application isn't working for me
the elements contained in the columns have heights specified (min-height and the ie trick to do the same) but i can't imagine that's what's causing the issue?

hi guys, I haven't done much with css, so can you tell me, as long as you you put all the different parts of your page in seperate div tags, and identify them appropriately, does it matter in what order you put those blocks in. for example, if I have a page which has 3 content areas, and a sidebar, where ultimately I want the 3 content blocks to be on the left and the side bar on the right at the top, would there be any benefit to
coding the HTML with the div blocks in a certain order and still get the layout the way I want it?

hal, because "coding the html with the div blocks in a certain order" is very wrong.

hal

sorry, I am not sure what you are saying, Zoffix

hal, you are thinking that your page is a set of "blocks"…. stop

ok, can you tell me how I should be thinking of it?

hal, see links from the bot in /msg

Zoffix, help me out here - could you be more specific please?

hal, it would take me about 40 hours to write proper markup… how can I be "specific"?
s/to write/to teach you how to write/;

Zoffix, I don't think you are being very constructive

I don't think I care.

ok, can anyone else kindly help me with this, as Zoffix is obviously in a bad mood

he's always in a bad mood

Amenthes,

how do i make it so the legend text wraps

legend {white-space: normal;} but…

Jezek4

oh

Does that work?

nope

So I have this dropdown menu, and I got the suckerfish script to work properly in IE. But I can't seem to get the list to stick to the left of my page like it does in FF, Camino, etc. The page fully validates as CSS. www.arcsupport.ca/new — Anything in particular I'm missing?

oh well.

oh welllll

@

(www.arcsuppor…) HTML: Failed (3 errors, see http://tinyurl.com/3bw6nr ) | CSS: Valid [23 warnings] ( http://tinyurl.com/27rnpz ) | DOCTYPE: NO DOCTYPE | (MIME: text/html, text/html; charset=UTF-8)

Attacus, fix your HTML.

Attacus # use HTML 4.01 Strict doctype

I didn't realize that HTML needed to be validated as well.
Thanks, Ill get back in a few once I sort that out.

if you have a div tag with both a class defined and an id (with the class and ID having different names), will the style from the class be applied first, and then all the same properties from the ID will override the class?

halwhatever comes first will be overriden, most browsers do that

]css specificity @ hal

css specificity: http://w3.org/TR/CSS21/cascade.html#specificity

hey guys

tvtoon, OK, I understand. So from what I gather is that you agree that using both a class and and ID for the same div "block" is correct, so that you can set a general style using the class, and finer style detail with the ID

how do I make a space between two table rows
or between 2 tds

yes
cell-spacing
margin
padding

i tried giving it a margin-bottom but it didnt work
tried applying a margin-bottom to a td

tvtoon, Zoffix does not like me to say call the div tag and everything it contains a "div block". Can you tell me what I should call it in order to avoid his wrath?

a div?

hehe, he means BLOCK ELEMENT
everything is a tag
a DIV is a BLOCK ELEMENT

isn't a div whatever you want

Hey Zoffix.

err nevermind that, I meant to press backspace but my hand hit the return key

No, you must understand the behavior of those…

does someone know a decent css menu which kind of looks like the windows file, edit menus in the top?

Thanks

No that's not what I mean.

So you will know how they work with your User Agent

s/…$/ent./;

That is a general rule about it…
You can make a TABLE be the same visual thing as a DIV, yes you can, but you can't change its processing method…

hal, you are thinking that your page is a set of "blocks"…. stop

hehe, Tetris styling!

]menus % reisio

reisio, not sure if you know, but there is also /notice _ZofBot3 menus and /msg _ZofBot3 menus

thanks

Is there a way to make it so that if two columns exist, they each take up 50% of the surrounding area…but if there is only 1, it takes up 100%?

Zoffix++
yup

Mind sharing the secret

phillipfry, when there is one is it either of both or you know for sure which one it always be?

#one ~ #two { width: 50%; } #two { width: 100%; }

tehe

:p

oh…heh
wait…hm.
not sure I follow…what's ~?

a selector not a lot of browsers support
mm
combinator

well, if not a lot of browswers support it…probably not good to use

you can do it with just nested divs, too

Well, it's using the dreaded tables (i didn't create site, dont hate me, lol)

ha

back

it is only a data table though, so probably the best way for it anyway
So yea, think there is a way to do it without divs?
Oh, well, wait, is there a way to specify First td, second td……or odd tds?
cause if there is I could set odd to 100% and even to 50%
that way if there is only 1, it would be 100% and if there is a second, the first is forced down to 50% since the 2nd would be 50%.

phillipfry, yes, if you are not supporting IE

wait, couldn't I do td.td so it doesn't affect the first?

no
]]]=

a http://www.webdevout.net/browser-support-html#support-html401-a (IE 6:72.222%) (IE 7:72.222%) (FF 1.5:88.194%) (FF 2:88.194%) (Opera 8.5:83.472%) (Opera 9:83.472%) (Konqueror 3.5: ?) (Safari 2: ?))

]]]+

E + F http://www.webdevout.net/browser-support-css#support-css2selectors-adjacent (IE 6: N) (IE 7: I)(FF 1.5: Y) (FF 2: Y) (Opera 8.5: I)(Opera 9: I)(Konqueror 3.5: Y) (Safari 2: Y))

td + td {foo bar}
That won't affect the first

yes, exactly

]]]nth-child

:nth-child(N)) http://www.webdevout.net/browser-support-css#support-css3pseudoclasses-nthchild (IE 6: N) (IE 7: N) (FF 1.5: N) (FF 2: N) (Opera 8.5: N) (Opera 9: N) (Konqueror 3.5: ?) (Safari 2: N))

I dont want it affecting the first

phillipfry, yeah, but IE 7 doesn't support that selector

What selector is that?

foo + bar
]css select

1) read: http://w3.org/TR/CSS21/selector.html , http://css.maxdesign.com.au/selectutorial/ 2) try it out: http://gallery.theopalgroup.com/selectoracle/

]]"css3" "selectors" site:w3.org

[Google] http://www.w3.org/TR/2001/CR-css3-selectors-20011113/ (More results: http://tinyurl.com/2pn6vf )

interesting. Even with it working (in ff), it doesn't do as I though it would. It correctly gave the first column 100% and the second 50%. Yet the 50% didn't take up the right amount. What could cause that?
Oh…I'm guessing it doesn't know which to apply first…bleh

OK, let me put my earlier question in another way. I have a page that is split into 3 logical divisions, navigation, header, and body. Is it advantageous to have these in a particular order in my code, dependent upon where on the page I want them to be located, or is it irrelevant?
uOK, let me put my earlier question in another way. I have a page that is split into 3 logical divisions, navigation, header, and body. Is it advantageous to have these in a particular order in my code, dependent upon where on the page I want them to be located, or is it irrelevant?/u

hal, search engines like google may like your page more if the real content is at the top of the code, but usually it's way way easier to put navigation and header before the content, in many cases it's a must.

it doesn't really matter, although it may be preferable to put the header first and the body before the navigation

Ajat, thank you
JD__, but if you ordered it in the way you suggest, and then at a later stage you wanted move the navigation visually from the end of the page to the start, it would be easy to do this *purely* with CSS?

Yes, but how practical that is may vary

JD__, I see what you are saying. That is very interesting. Thank you for your generous advice

if you're using floats to do two columns, floating both right will switch them around compared to floating them both left

]css vertical centering
]cs vertcenter
]css vertcenter
grr

]valign
]css valign
hum.
]fullheight

DECENT: http://phrogz.net/CSS/valign_in_body/block.html LAME: http://www.alistapart.com/articles/fauxcolumns/

thats not what i want
just vertical center in a block

]z vertcenter

http://zoffix.com/css/vertcenter.shtml

]vertcenter

http://zoffix.com/zoffix/css/vertcenter.shtml , http://reisio.com/examples/vertcenter/

called me a fat nerd

hey just wondering about some height problem i have with this layout and columns.

but thanks Zoffix

the #holder which holds everythign doesn't stick to the bottom of the columns

illmatix, try answering your own question knowing nothing about your code or wtf #holder is

www.soshal.com:6969
I ntoiced that the probelm was with FF1.0

_ZofBot3, l

http://td.td

@http://www.soshal.com:6969

(www.soshal.co…) HTML: Failed (12 errors, see http://tinyurl.com/2vldv4 ) | CSS: Valid ( http://tinyurl.com/yosdbp ) | DOCTYPE: XHTML 1.0 Trans + url | (MIME: text/html; charset=utf-8, text/html; charset=utf-8)

12 thats it?
yesterday there was 35
nice
do you really think those errors are the cause of the problem i'm having

hi

hai

could someone take a look at http://apparoat.nl/cms/adminpanel/ and look at why the menu is vertical in IE6 ?
@

(apparoat.nl/c…) HTML: Valid ( http://tinyurl.com/2d8kyq ) | CSS: Valid [9 warnings] ( http://tinyurl.com/38za6p ) | DOCTYPE: XHTML 1.0 Trans + url | (MIME: text/html, text/html; charset=iso-8859-1)

I'm trying out the cms 'cms made simple'. It has a css menu thing, which allows you to have submenus and you can make them appear just by hovering over. the problem is there's no way of centering the thing, because it uses the float: element. I've done a lot of searching and it seems this is a persistent problem with such menus - is there any way of getting round this problem?

maxo, use {display: inline;} instead of floats.
or read this -
]z center

http://www.zoffix.com/css/center.pl

http://www.zoffix.com/css/center.pl#float

could you perhaps take a look at my case?

bXi, I don't look at XHTML pages, ktnx

@http://apparoat.nl/cms/adminpanel/

(apparoat.nl/c…) HTML: Valid ( http://tinyurl.com/2d8kyq ) | CSS: Valid [9 warnings] ( http://tinyurl.com/38za6p ) | DOCTYPE: HTML 4.01 Trans + url | (MIME: text/html, text/html; charset=iso-8859-1)

how about now? :P

bXi, I make it HTML 4.01 Strict
s/I//;

done
still validates

]condcom % Zoffix
bah
sorry, meant to be ZombieLoff.

ZombieLoff, /msg _ZofBot3 || /notice _ZofBot3 || /j #zofbot

Alright.

bXi, so what's the problem?

in ie6 i get 4 items vertical of 100%width
in firefox i get the desired results

@
_ZofBot3, l

(apparoat.nl/c…) HTML: Valid ( http://tinyurl.com/2d8kyq ) | CSS: Valid [9 warnings] ( http://tinyurl.com/38za6p ) | DOCTYPE: HTML 4.01 Strict + url | (MIME: text/html, text/html; charset=iso-8859-1)
http://apparoat.nl/cms/adminpanel/

ul,li {display:block;} # useless
li a {float: left;} li li a {float: none; }

omg
thanks

hooray!
a project I've been working on for 6 months is days away from being released
ba project I've been working on for 6 months is days away from being released/b

until project manager comes and asks you if it's possible to add features x and y :P

haha

Howdy guys.. I have a 3 column box, each column is a div, each column is dynamic so cannot be a fixed width, I have got them aligned correctly, but the backgrounds don't go down to the bottom to meet each other, is there a way to fix this? http://www.yawnster.com/ (very bottom)

]sameheight

http://www.positioniseverything.net/articles/onetruelayout/equalheight http://www.alistapart.com/articles/fauxcolumns/

Unless you are not supporting IE

Thanks Zoffix
no I am not bothered about IE

Ajat, the project consists of the boss, the project lead (my self) and the designer

hi all

AlexLatchford, http://www.zoffix.com/new/sameheight.html
AlexLatchford, much easier :P ~
demio, what does the boss do?

provides the monies
and gets most of the profit

demio, can't you do it yourself?

]center

http://www.zoffix.com/css/center.pl , http://dorward.me.uk/www/centre/

I could have, but he had the original idea and contacted me to put it out
I could have, but he had the original idea and contacted me to put it out

jinzo, /msg _ZofBot3 || /notice _ZofBot3 || /j #zofbot

Zoffix, tnx

i cant go around stelaing people's ideas, that would ruin me

hey anyone up ?

Hey Zoffix, thanks for the column fix, its working great, but a regression has appeared where the elements inside have now been moved down.. from the top of the column..
http://www.yawnster.com/

@

(www.yawnster….) HTML: Valid ( http://tinyurl.com/2kjfex ) | CSS: Failed (1 errors, see http://tinyurl.com/2v6jwc ) [143 warnings] | DOCTYPE: XHTML 1.0 Strict + url | (MIME: text/html; charset=UTF-8, text/html; charset=UTF-8)

@http://www.yawnster.com/
Its an Opacity error
(I am using the Lightbox JS library)

AlexLatchford, #rightcol, #middlecol{vertical-align: top;}
]css names @ AlexLatchford

Don't use class/ID names like "right", "left", "red". The names need to reflect the purpose of the element, not what it looks like or where it is located.

ah, thanks

hi guys, when i apply a class to li item in a list, it is not being applied, can someone help ?
uhi guys, when i apply a class to li item in a list, it is not being applied, can someone help ?/u

you're doing it wrong

Hey omar. You know your e-mail and web servers are down

They are fixedd now

jd, lol
.last_list_item {border-bottom: 0;} — i'm trying to apply this to the last li in my list, but it still displays the border
when i do it as an inline style, style="border-bottom: 0;" it works

then the class isn't being applied
either a typo, or you need to hard-refresh to get the css to work
probably something simple like that

JDiggity, i've done that loads of times
i'll do it again to check

nzx, .last_list_item has any id ?
that element i mean

Amenthes nope
Amenthes well the main list has a style
and i'm trying to override it for the last item

Ah

the main list has an id, right?

use !important
like, border-bottom: none !important;

JDiggity, trying it now

or #id .last_list_item, if it doesnt work in IE

ah! thats done it
thanks alot guys

np

i've never seen that !imortant thing before

it's a specificity thing

does it tell the browser it must apply this style?

In a matter of speaking, yes. It makes this rule override any other
]specificity

cool, i'll make sure i remember that

]specifity
this would be easier if I could remember how to spell specificity
basically, certain rules trump other rules

just one more bug to squish in ie6 and i think i'm done

for example, inline styles beat stylesheets
and styles later in a document beat earlier styles
!important trumps everything
except another !important

cool
i know about the external, styles in head, then inline order
i've learned a valuable lesson just now!! thank you

np

i've manged to get my site to look the same in, ie7, ie6, safari (PC) and firefox

nice

theres a glicth in opera, but i've no idea how i'm going to get arround it!
http://ragulan.co.uk
if you want to have a look

what's the glitch

its working out some of the widths incorrectly

perhaps a padding/margin issue
]zip

* { margin: 0; padding: 0; }. You'll save yourself the confusion over quite a few strange element and browser spacing differences later on. * == http://www.w3.org/TR/CSS21/selector.html#universal-selector

i need a way to create a rule that will only be applied to opera to correct it, but i dont know how to do that
JDiggity, i've already done that

opera hacks are tricky

its not a serious glith
glitch*

generally I find that if it works in Opera and Firefox, and can be fixed for IE, then all is grand

there is about 5pixels extra on the right hand side of the page, everything else is fine
dam, i've just spotted another glitch in opera! i think i can fix it though

Hello, brothers

it's not exactly the right channel but you guys know everything anyway. How could i make a background image that has a gradient that lleads to transparent? LIke… white…. then fades to the background of the div behind it. PNG support this, but.. do all browsers support PNG?

photoshop
24-bit png with 8-bit alpha channel will do it

Dario, not IE 7

browsers support it, but IE6 will not; there is however a fix
]ie pnghack

http://www.twinhelix.com/css/iepngfix/ , http://xrl.us/jywg , http://devilock.mine.nu/pixie/ , http://xrl.us/sygd

aha, that's what i thought.GRR IE.

png is the way to go, use http://www.twinhelix.com
it's very simple

heh
I wonder what's the point of font resize on that site

on what site

_ZofBot3, l

http://www.twinhelix.com

the point is to be able to see the text more clearly

probably, I can do it with my browser much easier and faster.. unless you remember the preference it's pointless
menu is broken with JS off… heh
probably, http://text.ecreate.com.au # view in non-IE, works even with JS off.
the font sizer that is
er
http://test.ecreate.com.au

i love css
i should learn flash… but css is just too cool.

flash–

k. i'm out. Thanks for the help.

hello ppl
i got a little prob… i got a hoover code in my CSS.. which is doing great in firefox, works perfect..
but in IE.. it doesnt hoover at all
(change background when hoovering)
anyone know how to get it working in IE?

what version of IE?

6

IE6 only supports :hover for 'a' elements with 'href' attributes
is it sensible for you to use an 'a', or not?

table.contentpaneopenDaughters:hover {
background: #ebebeb url(../images/top_module_hover.png) 0 100% repeat-x;
thats it..

table, eh?

hm-hm whats wrong w/ that?
:$

nothing
you can take a javascript like this one http://reisio.com/medfs/app/tr.js
s/tr/table

yikes what does that do

and wherever you use table.contentpaneopenDaughters:hover {, just make it table.contentpaneopenDaughters:hover, table.contentpaneopenDaughters.hover {
it adds the class 'hover' onmouseover
there are simpler drop-in scripts
like…

so, double? o_O

;google whatever:hover @ alliy

http://www.xs4all.nl/~peterned/csshover.html

but that one uses some proprietary, non-standard code

hmmm reading

I doubt it has to
but it does, and if you're not into JS, it might be tricky to modify

I have a problem. I have 2-column layout which uses floats and the clearfix hack. But I need the 1px border seperating them to appear no matter what column is higher. How could I accomplish this?

sepArating*
one simple way is to give the container of both columns a background image

isnt that a bit dodge?

dodgey?
it's a bit inelegant
pmob.co.uk has some templates that don't need it

hmm how about if i put a margin-left: -1px; on the right column and put a right and left border on them respectively?

http://snipplr.com/view/1912/internet-explorer-ie6-css-hover/
hows that?

if you can do that, that sounds good
not any better I don't think
'behavior' is the non-standard, proprietary CSS I was referring to

right so use the .JS u were talking about ?
not sure what u meant with "s/tr/table"

if you look at the file, you'll see instances of 'tr'
because that is meant to look for tr elements
if you swap tr's for table's, it should work for table elements

w00t w00t added effects to http://haslayout.net and moved everything from SSI to Perl :P ~

so the hover command gets changed to a JS command ?

ooooh
when you hover over something, the class 'hover' is added to the element
so where you would use foo:hover { for normal browsers, you can just change it to foo:hover, foo.hover {

reisio, well, I'm not done yet, gonna add code sliders (hide, show) accessibility options, comments.

heheh
sliders

Yeah, some codes are long and I think it'd be nice to slide out HTML code to look at the demo and read the CSS code (which is after the HTML)

How do you get that gloss effect on the top header?

Of course the accessibility options will have a feature to disable the effects. And I'll also have "collapse all" button on sliders.
Noparse, gradiens :P ~

it's often called "glass" or "plastic"
any moderately decent graphics tutorial site will have something covering it

Noparse, http://www.dezinerfolio.com/2007/04/16/ultimate-web-20-gradients-v2/
:P~

neat headers
I think I'd like it if the tooltip didn't move, though

reisio, you mean didn't move with the mouse or didn't do that bounce thingie?

with the mouse
since the area is so small where it's shown
seems a bit silly
just how I see it :p
I wish all sites with headers/sections had freaking frag links
I wonder if anyone's made a js that pads the bottom of a layout so elements at the very bottom can be at the top when linked to
that always bothered me

Why is it that every single lyrics and game site on the internet still use tables 8|

because the people that assembled them are busy playing games or listening to music

hehe

Heh

also most lyrics sites only exist for ad revenue

'most' ?

yeah most
and most gamers (guys that make gaming sites) are little kids

name me one that doesnt have 6+ ads per page?

oh you're arguing for 'all' :p
admittedly, I haven't seen one without ads that I recall
but I'm sure there are som
some*

there are a few good game sites… newgrounds would be an example. havent seen a good lyrics one though

eh
newgrounds isn't horrible
but they have plenty of ads
and I hate how they use popups
and try to hide the location of the media files

They probably have a max of 4 per page. Which is good for a game portal. I wouldn't even want to know what their bandwidth bills are so I think they need it.
They don't use popups anymore…

’bout time

I just fixed that layout. Now to brace for IE6…

;define waved

waved: The same as UNDY.

rofl
;define undy

I haven't learned that word in school yet.

;define waived

waived: This substance does not occur locally, so testing for it is not required.

]define undy

me iz teh suck, ask some1 else

heh
]define waved

waved [gcide:8] Wave \Wave\, v. i. [imp. & p. p. {Waved}; p. pr. & vb. n. {Waving}.] [OE. waven, AS. wafian to waver, to hesitate, to wonder; akin to w[ae]fre wavering, restless, MHG. wabern to be in motion, Icel. vafra to hover about; cf. Icel. v[=a]fa to vibrate. Cf. {Waft}, {Waver}.] [1913 Webster] 1. To play loosely; to move like a wave, one way and the other; to float; to flutter; to und…

:P~
(Position Is Everything)– # lame promotion of Holly Hack
and what's with magic 1% ? why not just 0 ?
"See what happens now? IE sees that height and puts the paragraph next to the float, killing the 3px jog. And, since the content is certainly taller than 1%, the box is made taller to accomodate it! One bug sent to kill another. Woohoo! (kudos go to Holly Bergevin)" — "…certainly taller than 1%…" well DUH, there is no height on the parent, it's not even 1%

I'm looking for a freelancer to take a stie tahts working in Firefox and expand it to all major browsers (IE6, IE7, Safari)

SnakeO, link and how much

zoffix just sent a pm

I would enquire but I am juggling 3 projects which all have to be finished in a short amount of time. They all demand 100% of my attention 8| And yes, that is why I am chatting here.

shouldn't you be working?

SnakeO, "expand it to all major browsers" and "make it pretty ’cause I suck at designing" are different things.. And no need for insults either
_ZofBot3, black list add SnakeO

_ZofBot3, black list add Zoffix

SIGFAIL
]zoffix work @ SnakeO

Zoffix's work: Paid for: http://helenus.com/ http://www.drcs.com.au/ http://www.grilldteez.com http://www.martinoakfarm.com http://ecreate.com.au Personal: http://haslayout.net http://zoffix.com

SnakeO, now suck my shit!

this is supposed to be an impressive portfolio? Thanks for the links now I wouldn't think twice about not hiring you.

SnakeO, I'm not the one looking for cheap designs on IRC. I wouldn't work for you.

If I were looking for cheap hosting designes on IRC I woudl go to you, that's for sure.

what does cheapness have to do with it?

Why don't you goto RaC or HaF? I am sure you will get plenty of "Hi sir! we are indian design compny we wok you please"

heh

for $45/hr I would hope to get someone slightly better

than what?

They have professional programs like MSPaint, Microsoft Frontpage 4.0…

haha

"we are indian design compny we wok you please""

:P~

rac uses bids
you can get cheap, but it will suck :p

w00t
Man, isn't "text jog" bug can appear as a "ladder"? I've seen this before.. can't freakin' reproduce _

staircase, y'mean?

Yeah

I haven't used a design program like FP or DW in about a year. Except for at school where they force us to use FP 8|

isn't that just a normal float bug (not really a bug, just phenomenon)
money well spent gj :p

hm, ok, well whatever, I won't put that in the demo then

might be talking about something different

=o
how goes it?

annoying layout I'm obligated to finish
and if I don't finish it in the next six hours or so it will cut into my day

hmm
=(
gonna hit the sack
good luck with everything, reisio

thanks, peace

Hey, can someone direct me to the gap-fix page
I have a random gap in firefox and ie and I can't remember the fix
http://zentatsu.com/bsg/

$

text/html, text/html; charset=UTF-8)

where's the gap?

between the content and the header

img{display:block}

header should probably be a background image

gah, thanks

]imgap @ BSG

imgap: http://developer.mozilla.org/en/docs/Images%2C_Tables%2C_and_Mysterious_Gaps

And yeah, your markup could use improving

if you have a 3 column layout where you want the middle column presented first in the markup, then the left column, the left column needs to be absolutely positioned to the best of my knowledge… now that said, is it possible for that left column to force the size of the main container div for the 3 columns to expand
i ask this because i have a footer which clears below the 3 column wrapper

]layout @ da-drew

da-drew: Examples with proper markup and CSS: http://css-discuss.incutio.com/?page=CssLayouts , http://blog.html.it/layoutgala/ , http://glish.com/css/ , http://bluerobot.com/web/layouts/ , http://webhost.bridgew.edu/etribou/layouts/

and it only clears to the bottom of the middle column

I'm cheating with a scaled background image, Nanobot. Those extra divs are required.

theres going to be an undefined height to the absolute column on the left, i just need to have it hold its height to force the size of the container to be its height

no-styles doesn't work this this page, but I'm ok with that for what I'm achieving.

reisio read my question before u throw those rookie links at me

okay
]layout @ da-drew

da-drew: Examples with proper markup and CSS: http://css-discuss.incutio.com/?page=CssLayouts , http://blog.html.it/layoutgala/ , http://glish.com/css/ , http://bluerobot.com/web/layouts/ , http://webhost.bridgew.edu/etribou/layouts/

haha
That's what I was going to do :-D
da-drew, if you read those links, they'll tell you the answer
we could try to explain it, but it's right there.

ive read all this stuff… everyone has a different take on the "holy grail" of 3 column desgn

Better than reisio could do, trust me.

which is the middle one being first in the markup

not really

da-drew: so… more than one solution is bad?

why do you need the markup to be in any particular order?

im getting pissy because i used to be the ones giving help to you guys last year when i used to come around

no you didn't :p

and now u guys are being a smart ass to someone who actually knows their stuff

Does your conscience burn hot when you order them that way?

because I never ask for help in this channel :p

da-drew, I think you're just bitter.

a little bit

da-drew, if you are the "who actually knows their stuff" why the hell are you asking us?

:p

:P

Yeah, even I know how to do what you're asking to do.

because im opening up a project i did last year
im a little rusty,i just got out of the joint

Web design EXPERT by day, baby molesting criminal by night

rusty trombone :p

We are not worthy.

haha

Why didn't I apply block right away?

nah, nearly killed the man my wife was fucking

I need to make a habbit of web designing once a week so I don't forget basic shit?
Why did you try to kill HIM?

wasnt really trying to

SHE was the one who betrayed you.

i was heated
u get that way when u see the woman who supposedly loves u with all her heart
fucking some black guy

Uh oh, he was black
That makes his penis bigger than yours.
Suddenly I understand, small-penis-complex man.

ok man
enough

Uh oh.
reisio, protect me!

i did wrong, i did my time, its over with

can we get off this conversation please?

clearly it's not the best sign of loyalty or respect, but sex doesn't exactly negate love
now who's talking about sexual activity :p

?

and no one is apparently getting any either

'get off' :p

damn nerds

what are you? 12? :P

It's not over with if your excuse for extreme anger is because the man was black.
I sense borderline racism.

same

who cares if i was a black guy
it*

I don't care about any of it

seriously, change of conversation time

I care a whole lot.
About CSS, that is.
:^U

i didnt expect for me to be defending my wrongdoings again, then be accused of being racist on top of it

leave. EOF

EOF?

ive grown to ACCEPT and REGRET what has happened, i should not have shared, my fault

enough

Goddammit Zoffix, stop using so many acronyms and linux kernel commands to be funny.
I never get you.

a woman treated you like shit, guess what, you're not unique. Get over it.
ua woman treated you like shit, guess what, you're not unique. Get over it./u

BSG, I am !be_funny(); EOF

care a lot
we care a lot

GAH!

clap clapclap clap

The nerd humor, it burns!

har har
SIGHLAHG

(Seriously, what's EOF!?)

Now THAT was a awesome conversation.\

]abbr eof

EOF == End Of File | Coders say "EOF" often to indicate end of conversation for example.

end of file

…. so nerdy.

!

Zoffix, can we be best friends please?

]abbr rtfm

Read The Fine Manual

it would've been awesomeer if someone had talked about their S/O cheating on them

BSG, if you are a woman.

I will be a woman for you
(Wait, you know this is JediKirby, right)

Coders? Hah. Zoffix added that to pretend that other people actually use it

BSG, I know it's you… heh

OK, good. Otherwise that'd be a funny coincidence to say

hey since u guys care os much about my life how about u msg me about it and stop talking about it in here? as far as the layout goes….

Are you sure Flannel? I was going to suicide.

Flannel, huh? I've seen it used many times. Especially in #hackphreak on Undernet..

hey you brought it up

da-drew, if you hadn't noticed, we all stopped being amused by picking on you and your trials of guilt. Please stop.

if the middle column is dynamic in width, based upon the browser size, and both otuside columns are a defined width,,,, and you want the middle column being presented first in the markup

undernet is so disturbing

I've never seen it before. I imagine particular IRC channels have their own slang, so use in one isn't necessarily indicative of any wider audience.

Flannel, I miss you.

then it would require the outside columns to be absolutely positioned, correct? or at least one of them…

Flannel, http://www.urbandictionary.com/define.php?term=EOF

Why don't you visit all of the channels I visit?

and, for instance, googling shows nothing that I can see.

]layout @ da-drew

da-drew: Examples with proper markup and CSS: http://css-discuss.incutio.com/?page=CssLayouts , http://blog.html.it/layoutgala/ , http://glish.com/css/ , http://bluerobot.com/web/layouts/ , http://webhost.bridgew.edu/etribou/layouts/

 Web Hosting Provider | Hosting Provider

*
To prove that you're not a bot, enter this code
Anti-Spam Image

Leave a Comment

You must be logged in to post a comment.


Blog Tags:

Similar posts: