logo
IRC Archive / Freenode / #css / 2010 / February / 12 / 10
KriLL3
I make menus from unordered lists
Sacho
thanks
KriLL3
hence why I kill list-style
I enable it again ofc for actual lists
Sacho
So there is no concept of "get the previous setting"?
boogyman
unless your entire page is lists, you shouldn't apply that via the wildcard
TheHappyPelican
not in css2 ... but like i said, if i could visualise what you're trying to do, maybe there's an easier way
KriLL3
or I put it on "menu ul * "
TheHappyPelican
Sacho: can you set up a test case?
Sacho
I'm just trying to cut down on boilerplate code :)
KriLL3
Sacho: you mean re-iterate the same properties for multiple rules?
Sacho
since I can enforce the images to always have a certain url
KriLL3
ah
TheHappyPelican
still don't know what you're trying to do
or atleast, why
KriLL3
I'm with stupid.
TheHappyPelican
...
dreambox
hello people ! in http://gplus.gr/#contact do you have any hints why a.new breaks on the next line !?
or not :)
TheHappyPelican
#links li { line-height:25px; } is screwing it up for me ..
dreambox
TheHappyPelican ha.. strange.. the line-height !?:(
TheHappyPelican
the problem appears to be it NOT breaking onto the new line =/
errr
no i see it
dreambox
TheHappyPelican : I just disabled line height and no changes
TheHappyPelican
#links li a { width: 16px; }
toos hort
too short
fix your width
dreambox
TheHappyPelican disabled that too in FB no changes
TheHappyPelican
#links li a { width: 232px; }
try tat
that
(232 was the minimum it could be without breaking in FB for me)
but increasing font-size will kill it
dreambox
ye fixed!
KriLL3
no real reason to restrict the width of those
TheHappyPelican
nup
dreambox
KriLL3 : uhm, so no widths ? at all
KriLL3
don't see why you'd need em
designer
boogyman: none of the methods works in my case; for a more clearer example I have done a quick sample:
dreambox
KriLL3 I thnk i added width to have the block display of the links
KriLL3
ah
why display em as blocks?
Munter
Has anyone in here done speed comparisons of dynamicly injected stylesheets targetting dom elements versus inline styling the same dom elements?
dreambox
KriLL3 You were right heh its stupid .. deleted both widths there
designer
in my sample from above, I do not know when the 1st "row" will be full so that I can place a div with clear:both
Sidnicious
Could y'all help me with a small IE 6 issue? Here's the page <http://www.wesleywkropp.com/services>. The top navbar, which is arranged with floats (the only way I could get consistent appearance in IE 6, 7 and standards-compliant browsers) is invisible in IE 6. Oddly enough, the bottom one is visible.
KriLL3
Sidnicious: got a brick wall handy?
TheHappyPelican
woah, designer: what kind of data is that "table" holding?
designer
TheHappyPelican: one, that has variable height
nemo
Sidnicious: well, could try toggling haslayout, or maybe adding an overflow on a parent
Sidnicious
KriLL3: Yeah, and I'm here because I'm going to get blood and hair on it if I keep trying to fix these IE issues myself...
nemo
Sidnicious: just a guess. wrap the haslayout toggle in a condcom of course
TheHappyPelican
designer: i ask because it might be ok to use a table
i knew it was variable height, so answer the question
Sidnicious: the bottom one isn't visible in ie6 either
designer
TheHappyPelican: I use divs, because with divs, I can achieve liquid layout, and that's what I aimed... but my child element's may vary in height, so my liquid row would suffer...
Sidnicious
TheHappyPelican: Er, OK. That seems to have changed after I tried relatively positioning the navbar.
TheHappyPelican
designer: what kind of data is it holding?
Sidnicious: looks like .nav a {}
and lack of layout
Sidnicious
If I remove the testing style, </me removes extra style>, it comes back.
TheHappyPelican
nemo was right
Sidnicious
TheHappyPelican: .nav a {} what?
TheHappyPelican
Sidnicious: i dont think your menu haslayout
and you're using inline-block
_ZofBot4
(wesleywk...vices) HTML: Valid ( http://xrl.us/bgvudy ) CSS: Valid ( http://xrl.us/bgvud2 ) DOCTYPE: <!DOCTYPE html> (MIME: text/html; charset=utf-8 )
Sidnicious
I'll try giving it layout... what's the effect of inline-block going to be?
TheHappyPelican
]]]inline-block
_ZofBot4
No idea
TheHappyPelican
fag
]]]display
_ZofBot4
display http://www.webdevout.net/browser-support-css#support-css2propsbasic-display (IE 6:30.556%) (IE 7:30.556%) (IE 8:94.444%) (FF 1.5:80.556%) (FF 2:80.556%) (FF 3:91.667%) (Opera 8.5:94.444%) (Opera 9:94.444%))
boogyman
http://colinaarts.com/articles/inline-block-and-you/ @ Sidnicious
Sidnicious
This is why I can't be a web designer for a living... Thanks, give me a few to read through all this.
TheHappyPelican
wait a second
boogyman
Sidnicious: desire is really your only hurdle... if you don't want to be a web professional you won't be
TheHappyPelican
Sidnicious: your <a> are actually there in ie6, the text is just missing
is it line-height: 1; thats the problem?
Sidnicious
boogyman: I do desire to be a web professional, I just don't want to be the guy responsible to making everything look right in IE :)
TheHappyPelican
why do so many people insist on setting line-height? :/
haha, that's a massive part of the job
atleast if you work on frontend stuff
nemo
]haslayout
_ZofBot4
IE hasLayout: http://haslayout.net/haslayout , http://www.satzansatz.de/cssd/onhavinglayout.html , http://fumle.dk/public/webdev/IEhaslayout/
Sidnicious
TheHappyPelican: Do you think it's even worth having that in my reset CSS?
TheHappyPelican
i don't usually include it
nemo
I've started further reducing my support for IE, but having menus you can actually see is still kinda necessary :)
boogyman
Sidnicious: there will always be browser-specific bugs. IE is just talked about the most because of its market share, and because IE6 and IE7 do still have a significant market share
TheHappyPelican
boogyman: and they're often a bigger pita than other browsers to debug
boogyman
While IE8 isn't perfect, it is a huge step in the right direction! :)
peper
hello
is a dropdown menu sensible doable in pure css?
TheHappyPelican
peper: Yes
]succerfish
grr
]suckerfish
sifnt
]]suckerfish menu @ peper
_ZofBot4
peper, [Google] http://htmldog.com/articles/suckerfish/dropdowns/ (More results: http://xrl.us/bgvue5 )
peper
TheHappyPelican: thanks
designer
does CSS support even and odd childs?
riven
children*
boogyman
designer: yes
riven
yes, but not too well supported yet.
:nth-child(odd|even)
designer
is it CSS3 ?
riven
yes
designer
:(
that's no good... not well supported yet
boogyman
]]]:nth-child
_ZofBot4
Yeah, right!! Keep on waiting!
TheHappyPelican
designer: you never answered me before ... what kind of data is it holding?
cryptide
riven, that is nifty
boogyman
]]]:nth-child
_ZofBot4
lalalala-lala-lala
designer
TheHappyPelican: text
boogyman
(Action) slaps zbi**h!
TheHappyPelican
if it requires that many divs, use a table
designer
TheHappyPelican: thanks
vices
how do we do this: #home-middle th .question
TheHappyPelican
is it <th class="question">?
Seldon75
im having a few problems with my layout http://www.webdevout.net/test?02j&raw
vices
TheHappyPelican: yep
TheHappyPelican
or <th><div class="question"></div></th> (div or some other element) ?
Seldon75
first, how can I stop the 'root' div from overflowing the 'main' div?
TheHappyPelican
then #home-middle th.question
no space after the th
vices
TheHappyPelican ahh, thanks!
boogyman
TheHappyPelican: ew @ div inside th
TheHappyPelican
boogyman: i know, was just checking
(Action) kicks boogyman where it doesn't validate
boogyman
that almost made sense
TheHappyPelican
(Action) feels like a supernerd
Seldon75
you are
so please how can I stop the 'root' div from overflowing the 'main' div? http://www.webdevout.net/test?02j&raw
i'm also trying to get the 'list-box' to lne up to the right of the 'root' div
i'd really like to use divs instead of tables these days
but it's hard to learn ;S
vices
overflow: hidden
hyperstream
TheHappyPelican, lol
TheHappyPelican
Tomashe
hey guys i wonder there is a way to make a divs float and stratch to the size of the div... example i got a menu with 5 elements inside it the container size is 800 so i want each of the 5 will be in the size of 800/5 automatic and if i got 6 so it will be 800/6...
TheHappyPelican
use some god damn punctuation
(Action) is cranky tonight
boogyman
Tomashe: use percentage widths
Seldon75
thanks!
Tomashe
percentage widths means?
vices
TheHappyPelican: ahh percentage widths, you sir are a genius
TheHappyPelican
.......
Tomashe
i dont get it guys
boogyman
Tomashe: 5 columns = each column being 1/5 or 5/1 (20%) width of the parent
Shwaiil
Q: <input> doesnt accept cursor: hand, etc. Even trying with !important; Tested on FF. Is this truth or theres something wrong. How could I solve this ? Thanks a lot!
Tomashe
yes but how do i do it on css
boogyman
]css width @ Tomashe
_ZofBot4
Tomashe, css width: http://w3.org/TR/CSS21/visudet.html#propdef-width
KriLL3
guy in other chan has awesome text formatting, it's all inline and the tags look like this: <p><span><strong><span><span>text</span></span></strong></span></p>
Tomashe
it's dynamic website so i want my client to add items as much as he wants without me need to change sizes
KriLL3
yes, a span inside a span inside a strong inside a span inside a p
TheHappyPelican
Shwaiil: cursor: pointer; ?
KriLL3
each with different text properties
Tomashe
i know what precentage means
TheHappyPelican
Tomashe: width: 25%;
KriLL3
guess he never realized you could have more than one property per element
Shwaiil
TheHappyPelican, Hi! I'll try it!
Tomashe
lets say i put 25 and my client suddenly add 7 more items
i need to go and change it again
boogyman
Tomashe: at some point the number of columns is stored... use that to apply a class to each column
Tomashe
i want it to be done auto
Shwaiil
TheHappyPelican, Thanks! Worded just fine bro' ;D
Tomashe
hmm
TheHappyPelican
word
Tomashe
basicly you are telling me to use server or client side lang to produce the % ?
cuz this is waht i wanted to prevent :) but if it's the only way ....
boogyman
Tomashe: I know you were exaggerating, but 5 columns is "pushing-it", anything more then that is going to be detrimental to the layout
TheHappyPelican
boogyman: i think he's just trying to evenly space a menu
or something similar
Tomashe
yes
TheHappyPelican
(Action) makes a massive presumption
Tomashe
i want to even it so the design will looke good even if the client add more items to the menu
boogyman
Tomashe: regardless of what you set, you have the potential to have a long list-item, how will you handle that?
Sidnicious
Sorry, afk-land.
Tomashe
it doesnt matter atm... i just want to know how to do it ... after that i will deside what to do
i dont have list of items
boogyman
Tomashe: start the menu from the upper left, maybe a little bit of indentation, but let the list items speak for themselves
Tomashe
its just TOP menu .. it will have betwin 5-8 i guess
vices
TheHappyPelican: ah, I see you are truly wise in all things.
TheHappyPelican
huh?
boogyman
your design shouldn't hinge on the list-items being equal, having a "justified" menu will probably detract from the design
vices
when you help me i don't forget it! EVER! YOU SHALL BE THANKED FOR ETERNITY!!!
TheHappyPelican
i don't recall helping you
boogyman
you asked with your eyes Trent, you asked with your eyes
vices
even though your memory is not good you are quite good with computers
Shwaiil
Q: On IE, If there's a link text with width bigger then the container (in terms of text), it doesnt "break", while it does on FF; Is there a fix? other then overflow: hiddden ? Thanks a lot for your atention!
boogyman
Shwaiil: define break
TheHappyPelican
Tomashe: i've come across that issue before actually ... i don't know how to overcome it with a list and basic css ... it's not that easy ... i tend to ask clients if they plan to update primary menu items ... if they do i ensure the design can accomodate 3 or 4 top level menu items (ie: its not evenly spaced)
elmargol
Tomashe, http://www.sitepoint.com/forums/showpost.php?s=5a3bfd212d441ea0820128281efc103c&p=4389823&postcount=2