free blog   apache   shopping directory   php powered
BluebieI still see the list?
samtihenah, sorry, on localhost
Bluebieokay..
samtihenill just google collaping margins
samtihenthanks for your help
samtiheni just needed a direction!
Bluebieset "list-style-position: inside;"
samtihenmuch appreciated
Bluebie :)
samtihenwill do
Bluebieon the ol..
BluebieYou're welcome :)
samtihencool. its the paragraph as well
samtihenit shouldnt be as close to the image as it is
Bluebiepadding never collapses, so if you need to avoid this confusing mess, use padding when you can
Bluebieah
Bluebietry setting overflow: hidden on various things
samtihenthe image has a margin and a padding
Bluebieit can stop collapsing margins
Bluebiebut googling the phrase will reveal many solutions :)
samtihenthanks!
fearfailhey, i'm doing something like this: #parent p { color: red; } .child p { color: green; } and in html: <div id="parent"><div class="child"><p>footext</p></div></div>
fearfailfootext is still red. Why does the child div not override it?
m4rtin]css specificity @ fearfail
_ZofBot4fearfail, CSS Specificity: http://htmldog.com/guides/cssadvanced/specificity/ , http://w3.org/TR/CSS21/cascade.html#specificity
m4rtinuse: #parent.child p to get a high enough specificity to override
fearfailahh i see how it works
fearfailthankz
msephis it possible to make a horizontal menu in css so that the items are evenly spaced across the page without specifying the width of each item separately?
Bluebiemseph...
BluebieDo you intend that the gap between the last letter of one item and the first letter of the next would be even, or that the centre points of each item would be evenly spaced?
Bluebiesuch that two long words would have little gap between them, but be still laid out to the same rhythm regardless of their size?
msephthe latter
msephlike solution number 2 on this page: http://www.sovavsiti.cz/css/horizontal_menu.html
BluebieYou'll need to specify a width for all of the items..
msephok cool thanks Bluebie
BluebieI take it you have some trouble there due to a dynamicism to the list's contents?
msephyep, but i think i can deal with it
foois it good practice to uppercase the actual text on a website, or use CSS to make it uppercaes?
msephi didn't want to have to rely on a scripting language if css and html could handle it by themselves
BluebieAlrighty..
Bluebiefoo: Use CSS on the basis that a screenreader might confuse BIG HATS for B.I.G. H.A.T.S. and try to spell out the letters, would be my entirely baseless guess.
rivenfoo: that depends. If the actual text is supposed to be uppercased to make sense (e.g. NASA), then do so. If it's just for stylistic purposes, use CSS.
BluebieAside from that, I can't see how it would matter beyond what's most convenient
BluebieUsing CSS leaves you more wiggle room in the future if you redesign and decide you no longer want it capitalised, don't have to go hack the content/software
Bluebie<3 Web Fonts ^_^
BluebieFont Squirrel is such an awesome service!
rivenfoo: so, say you have a menu (Home - Products - Contact) and you want it to be uppercased, do it with CSS - never in the HTML.
fooriven: gotcha, stylistic. thank you
rivenfoo: what Bluebie said is also true: screen readers will get confused :)
foowhat are "screen readers" ?
rivenfoo: http://en.wikipedia.org/wiki/Screen_reader
Bluebiefoo: It is a tool used by the blind in order to access software and webpages
fooBluebie: ahh, ok
foohadn't thought about that, thanks!
BluebieEssentially, a more advanced version of the 'read text aloud' text to speech function on any computer, capable of describing shapes, layouts, and interactive components like buttons and links in a way which allows the disabled to operate and navigate the interactive parts
MattiasI was just wondering, overflow-y <-- seems to work in all the browsers I've tried it in, IE5, IE6, IE7, IE8 etc, chrome, firefox. and so on.  I can't find overflow-y on w3school, was just wondering, is this valid css? :P
MattiasI want scrollbars on y
riven]w3schools @ Mattias
_ZofBot4Mattias, W3Schools == Errors, omissions, deceit.  Stop reading/pointing to them! Syntax Errors in the example --> http://xrl.us/bfxwd | Complete bullshit -> http://xrl.us/bfxwf | Can't get it even more wrong if tried --> http://xrl.us/bfxwh
rivenMattias: overflow-x/-y are part of a CSS3 module
rivenAnd, indeed, supported by all browsers you could possibly care about.
Mattiasyeah, I read that from google hits, but then I saw those older browsers had it too
Mattiasso w3schools is junk then? :P
rivenyes
MattiasI thought w3school came from w3c
rivenno
BluebieNope, hence, deceit :P
Mattiasgah
MattiasI always thought that!
rivenlots of people do
Bluebiethe w3c has their own websites with lots of very useful, well written, accurate information
MattiasI'll go straight to w3c for info then :)
msephfor a horizontal menu with items evenly spaced across page is there any reason not to use tables?
Mattiasmseph, semantics
Mattiasmseph, you just progressively enhance a page with css, if the web browser does not have css, the page should still display properly
msephok thanks Mattias.  semantics means that ul li is more appropriate notation for a menu than table tr td?
Mattiassemantics means you use the right element for the right purpose, or something like that :P
oksushimseph: <table> is inappropriate html for a menu. A menu is a list of links
oksushitherefore, use a list, most likely a <ul>
Mattiastables are for data
oksushiyou can 'evenly space' <li> over a <ul> by setting a width
msephyep thanks oksushi and Mattias
steven_thia
squarewould someone please send the actual link http://xrl.us/kd35 is pointing to. xrl.us is blocked in my network
Bluebiehttp://www.hotdesign.com/seybold/everything.html
squarethanks
BluebieYou're welcome ^_^
Action: Bluebie does so very muchly want a Square
giggseyIs it possible to do outline-top: ?
rivenno
rivenwouldn't be much of an outline
MultiplyLet's say I have a website, like <body><div>header</div><div>rest of the site</div></div></body> <- If my header is always having a height of 20px, how would I go by making the rest of the content, be 100% - 20px? :P
MultiplyI wrote 2x </div> at the end. That's obviously only supposed to be one.
rivenMultiply: http://www.pud.ca/misc/testcase/fullheight.html
SlartibartPage is #header,#main,#footer. #main is relatively positioned, with height set. Within it there's a block element whose height varies between 224-287px depending on the vertical space available. But how to center i vertically within main?
Multiplyriven, I kinda need the reversed. Having a header instead. Plus can I use body as the container?
rivenMultiply: just ignore the footer -- and you can add the header inside of the main column
Multiplyriven, I guess I'm just confused atm. It's getting a bit more advanced, give me a sec, to put up an example :P
MultiplyWhat I want to achieve is header (100% width, 20px height), then a sidebar (200px width, full height), next to the sidebar, is a tabbar (full width, 30px height), and under that, but still next to the sidebar, goes content (full width, full height).
enojHow can I force text without newline to wrap? is it even possible? - http://idev.no/breaktest.html
MultiplyI've almost set it up properly, but the header keeps bumping down the whole page by the 20px :P
rivenenoj: `word-wrap: break-word`
HeliodorThere's a dotter border around buttons with images when i clicked them, how do i get rid of it?
rivenHeliodor: "buttons with images"?
Heliodorinput buttons
Heliodorwith src=/image.gif
Heliodorfound solution http://css-tricks.com/forums/viewtopic.php?f=2&t=1696
rivenHeliodor: input::-moz-focus-inner { border: 0 } for moz
HeliodorThanks. seem there is no solution
rivenHeliodor: note that whatever you do, always make sure you have *someting* in place to indicate that the button is focusses
rivenerr, focussed*
HeliodorOk
HeliodorIm using a js script for that.
HeliodorHm, i'll just keep it.
HeliodorSeem it won't work with keyboard
enojriven: got something for opera users also ?
rivenenoj: no.
Multiplyriven - Here's an example, but it's not quite right yet. http://editor.exte.dk/
rivenMultiply: passworded
Multiplyriven, I _just_ removed it
MultiplyAs you said it. :P
Multiplyriven: I don't know if my description earlier explains kinda what I want to achieve, precisely enough.. But I basicly have it. I just need to get rid of the scrollbars. If there's too content in #sidebar/#content, they should have scrollbars tho.
rivenMultiply: you're gonna be able to do that, not cross-browser anyway
rivenerr
rivenNOT gonna be able :p
Multiplyriven, as long as it works in firefox, I'm happy. It's just going to be for me anyway :P
rivenMultiply: you may want to look into the Flexbox layout system, then
rivenThat's the closest you're gonna get, and I'm not even 100% sure it can do exactly what you want
MultiplyIf all fails, I can go and rely on some javascript, I guess.
rivenindeed
rivenMultiply: see https://developer.mozilla.org/en/Mozilla_CSS_support_chart (search for 'flex')
rivenMultiply: also see http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/ for more details, but note that mozilla's implementation may not be 100% compatible with that draft
MultiplyI'm wondering tho.. Can't I just absolute-position everything, and put proper margins/divs on, and use overflow:hidden / auto?
Multiplyr/div/padding
MultiplyFor content, padding-top would be 20+30, and padding-left would be 200.
MultiplyAnd of course positioned to top:0;left:0
MultiplyI don't know... I'm gonna go for flex. It sounds more awesome.
rivensure, but that's generally not a very good approach
rivenalthough in this case, that could work
BluebieHeya!
Multiplyriven, actually flexbox is pure love. I'm gonna go with that, and only use firefox. :P
rivenyeah, flexboxes are sweet
rivenMultiply: webkit also supports them, with -webkit- prefix, but you may run into small differences
BluebieI'm wondering if anyone knows of a technique to solve this problem..
Bluebiehttp://creativepony.com/gallery/viewer/Photography%3AGlass+Pony%3ATime+for+Training.jpg
BluebieI'm trying to get the large image in the middle to resize to fit within the area given, without causing a scrollbar or being signifficantly clipped
BluebieBut I'm having a hard time getting 100% to mean 100% of the remaining space rather than 100% of the size of <html>
BluebieIs there a way to solve that?
BluebieAside from scripting it..
rivenBluebie: without being significantly clipped? You'd rather the image is distorted instead?
BluebieNo, while maintaining aspect..
Bluebieit's working fine as it is, except for being 28px too high in safari..
rivenor do you mean, fit the image in the designated area, so as to cover as much space as possible, while still displaying the whole image?
BluebieNot sure about firefox as I don't have a current version on my computer
Multiplyriven, quick question.. I'm using -moz-box-flex, and so on, but am I just supposed to use "display: box"?
riven-moz-box
Bluebiefit such that white (well grey) space appears on the sides if needed to keep the entire image viewable while shrinking it to fit within the viewport
Bluebiemax-width/height are being quite helpful there
MattiasMultiply, remember to use the -webkit equivalent
Mattias-webkit-box :P
MultiplyBoth in the same display?
BluebieI don't care if it doesn't work in old IE < 9 so long as it isn't terribly mangled in them :)
Mattiasboth in the same css rule
MultiplyAnd Mattias, I'm only going to use it in firefox anyway. :P
MattiasMultiply, will other uses go to this page
Mattiasusers*
MultiplyNot ever, no.
Mattiasthen you are fine :P
MultiplyI'm in love with flexbox now. Really making this whole lot easier.
MultiplyAnd what's even better, is that I can resize my sidebar easier, with js, than before. Heck, even with CSS if needed.
eneasHi
eneasif I need 4 td width 200px and 5 td with the rest
eneasI can use first td width 200, second width 200, and 5 100% ?
Multiplycolspan 3
eneasoh yes, thanks
dgxhey guys, how do you work on you projects(own/work/others)? Do you start straight from the design/coding phase or do you do some project specs before hand(or your manager/employer?)
ZombieLoffelolwut
dgxYea, im serious tho.
cigan_how do make table borders only appear on top and bottom? tks for helping
Bluebiecigan_: look at border-top and border-bottom
cigan_i set it to 0 in the <TR> tag dint work
eneasHow I can open div with full screen
eneasposition: absolute, margin:0, left: 0, top:0 height: 100%
eneasnot found
eneasheight not is 100%
MultiplyIs any of the parent elements position set?
eneasinner body
eneasbut body i can't modify
MultiplyShow an example. :P
eneas$("body").append("<div class='xxx'>test</div>");
eneasxxx { position: absolute; top: 0; left: 0 ; margin: 0; width: 100%; height: 100%; }
eneasdiv with xxx class not showed in full screen
riven]secret @ eneas
_ZofBot4eneas, secret: No URL = no help. We are not telepaths, and can't determine the problem (let alone the solution) without playing with the troublesome page. So, give URL, or leave the channel and call 1-900-PSYCHIC. Oh, and good luck. You'll need it.
SlartibartAny thoughts on how to vertically center the menu and image on weareart.se ? Problem is they both vary in size as browser viewport size changes.
Travis-42Is there a css3 selector for matching by inner text? Somewhere I read about ":contains", but it doesn't seem to be part of the spec, or generally supported
rivencorrect
rivenit was removed
peb7268hey guys having a color matching issue with css
Popular searches: Savage2Install-2   what does shafu mean   vsftpd AND   Cups2freefax   

Generated by irclog2html.pl 2.1mg by Jeff Waugh - return