i have been trying to make rounded corners for my mainmenu highlight but I have only found one way to have ONE
hello, i have been trying to make rounded corners for my mainmenu highlight, but I have only found one way to have ONE background for my .mainmenu li a:hover, and that gives me a rounded background to the right, but what would be the right way to ALSO add a left rounded corner?
there are rounded corner generators on the web, did you try one of those?
http://www.roundedcornr.com/rc1.php this is what i use
hm.. didn't know that, thanks
www.haugseth.net, if you look at the to menu, you see my problem
nice design
your corner problem should be solveable by looking at the code the rounded corner generators spit out
thanks
yeah, I'll have to look at it some more, thanks for your help
what properties do you set, if you want a file input to have no 3d effect
there are no "not" selectors in CSS, right?
How do you mean?
O.o
"any element whose class is NOT foo"
nope
Conditional statements are a no no
Why would you need such a thing? O.o
I can see the need for it… but it's pretty easily circumvented
sounds like your defaults aren't properly set up
i am circumventing it by specifity
but a conditional would make the CSS more compact and IMHO easier to read
but it's not that important
Yeah, use defaults
Then override sections with the use of !important
yes, that is what i am doing now.
.j math
while trying to create floating divs for some blocks(content), if no height is assigned to each div, then it doesn't render properly
however it does when a specific height is set. Is there any way to get rid of distorted rendering when height is unknown or each column?
Hello, I need a custom javascript code to slide images. I want to know if anyone is willing to earn some bucks. What I'm looking for is here http://www.gamespot.com/video/918428/6172011/ On the part where it says Lastest, I want that
thing for my webpage only that part. Please pm me o send me a mail to rodrigo@eel.com.mx (its also my MSN), Thanks guys!
Perhaps a Javascript channel would have been a better bet?
hi all, I 've a problem with the CSS validation of my weblog. You can see it at: http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fmarkon.netsons.org&warning=1&profile=css21&usermedium=all
Can you help me only with the errors (not warnings) ?
Can't you help me ?
if i want to make a thumbnail of a larger picture if i did this img src="image1.gif" width="100" height="100" would it do that?
without actually downloading the original picture
or do i need to actually create the thumbnail picture..
1. don't use HTML inline styles
2. you actually need to create a thumbnail; that other method would just shrink the display of the large image
a ok
- "HTML style attributes"?
or h1a?
dont validate
of course not; A is an inline element, H1 a block element
block; to your A element
…. inside the H1 still
…
does html 4.01 Strict support overflow-x/y, and if so, how should it work?
because it doesn't seem work unless I have either no doctype or 3.2 doctype.
overflow is a CSS property
i.e. not directly related HTML
*related to
http://de.selfhtml.org/css/eigenschaften/anzeige/overflow.htm
ok, but if I take it out, the overflow-x in IE6 does not work
under 4.01 or later
it just hides everything
that's just overflow, not overflow-x
]]]overflow-x
Waddayawant?!
wth is overflow-x then
]]]overflow
something that's supposed to just make the horizontal scrollbar disappear
overflow http://www.webdevout.net/browser-support-css#support-css2propsbasic-overflow (IE 6:41.667%) (IE 7:50%) (FF 1.5:91.667%) (FF 2:91.667%) (Opera 8.5: Y) (Opera 9: Y) (Konqueror 3.5: ?) (Safari 2:
?))
it's not in my reference
is there another way to do that?
for horizontal only? what do you want it to do instead
right. for horizontal only
so you want like overflow-x: hidden; overflow-y: scroll; ?
not possible AFAIK
right, it works fine with 3.2
sux.
why would a 4.1 doctype not support overflow-x, and 3.2 support it?
http://www.blooberry.com/indexdot/css/properties/position/overflowx.htm says it's IE5 only
not sure how reliable that is
how do you format a table, so that the inside borders are dotted lines and the table has no outside borders
it's IE6 too, but you see I don't have scrollbar problems with Mozilla
table { border: 0; } td { border: 1px dotted #F00; }
block. And i dont think display block will validate
yes - why wouldn't display: block; validate?
h1a style="display: block;"…
is there a logical reason for not supporting overflow-x/y?
search some newsgroups, I dunno
:-|
but the lack of a "logical reason" doesn't mean anything anyway
http://paste.css-standards.org/23251 : Can anyone tell me why theres a space between the top image and the borders of the news area? Ive tried adding a padding 0 and margin 0 but it still refuses to work
I mean isn't it common to want the horizontal scrollbar not to appear when you have a slight overlap?
]zip @ Nyture
Start every stylesheet with this: * { 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
shiite
I can't center my images now without 4.01
wth
i found this way to center images:img.displayed {display: block; margin-left: auto; margin-right:
auto}
it doesn't work in 3.2 doctype
why the hell would you use that doctype ffs
so that I can use overflow-x
great, fix one problem by creating 100 others
sure
well I guess I could create a container div for the elements that are going to go too far off
and set the overflow property for the div to cut off those elements
think that would work then? ..
TIAS
TIAS?
wont validate. even with display block
Try It and See (chat)
re-read what I said
aha
arite.
bloxk would fix it. It dont
It doesnt*
h1a style="display: block;"…
in that case i dont need dispaly block?
well, then the A won't extend
TIAS
How to search engines look att h1 with a inside?
Ace_NoOne
i've realised what i need to do now
good for you
make a thumbnail of the picture using imagick but keeping the aspect ratio, then constraining to exact pixel size when i call the image
although it's not perfect..
i'd rather crop it when i call it
is that possible?
hidden; on the parent container
that might work
ok thanks
How will search engines look att h1 with an a inside?
what's an "inside"
inside
(not its contents though) in terms of indexing the content (excluding link handling of course)
ok
How do I position a image to be behind everything else and in the top right corner of a site?
use body { background-image: url(…); }
ahhh bbut see i have 2 images i want to do this to
here's another question…
is there a way to use position:absolute and CSS centering to center an image?
eg:
img.displayed {display: block; margin-left: auto; margin-right: auto}
does z-index: -1; work, Nyture? I haven't been successful with numbers greater than zero O_o
possibly should work
:-|
why use -1 - use * { z-index: 2 } and 1 on the IMG
why would you use abspos
i don't want the browser to make my top coordinate relative to other images
also I don't even like this centering
I need it centered to the screen width max, not the browser window
zindex works for putting it behind
I tried using javascript host to do it but I can't make onload() work right
]deadcenter @ aeroclown
deadcenter: http://reisio.com/examples/deadcenter/
err, @ agamemnus
but i need to position it also, and its giving me trouble. It wont snap to the top right corner
]zip @ Nyture
Start every stylesheet with this: * { 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
got that already
Ace_NoOne, do you know if there's a way to use CSS names and javascript together?
that way I can use my centering script on those images
cSS classes I mean
what are you talking about - and you absolutely should not be using JS for this
ok, how do I center an image host based on the screen size?
http://reisio.com/examples/deadcenter/
try that
if i want to set the properties of that table, do i have .details table{ width… } ?
it resizes based on the window size
yes wanderingii
I need it to resize based on the screen size
hello
eg, width=800, 1280, etc.
sounds odd - but what's the problem then
im trying to centre text within a div vertical centre and horizontal centre, how can i do this?
]deadcenter @ ilovefedora
deadcenter: http://reisio.com/examples/deadcenter/
actually, ilovefedora, hold on
Ace_NoOne… I don't know how
you said you had a JS script
for horizontal centering, use margin: 0 auto; - for vertical, see here:
yeah but the problem is that I can't iterate through all the elements recursively and look for those with a "center_" in their id
]middle vertical-align @ ilovefedora
middle vertical-align: www.phrogz.net/css/vertical-align/index.html
google for getElementsByClass
and ask in JS
(that's how I was doing it, but it didn't work on one of my pages)
ah, getelementsbyclass
thanks
it's not in the standard library
everyone's dead or almost dead in #javascript
when a div is absolute, the javascript onmouseout behaves abnormally, while when div is relative/static it work as expected, do anybody know why?
how can i set the properties of my table that it has no outside border at all, only the inside lines are visible
wrong channel
table { border: 0; } td { border: 1px dotted #F00; } — you could also have a border only on certain sides for the outer cells, but you need to set an extra class then
tried that but it doesnt work
table-cell; throws the alignment of div off
centres text though
http://www.rwautomotives.co.uk/
]]]table-cell
table-cell http://www.webdevout.net/browser-support-css#support-css2propsbasic-display (IE 6: N) (IE 7: N) (FF 1.5: Y) (FF 2: Y) (Opera 8.5: Y) (Opera 9: Y) (Konqueror 3.5: Y) (Safari 2: )
as you can see , its stupid to use table-cell at all , ilovefedora
yep but how else am i supposed to centre text vertically
]secret @ wanderingii
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.
YAY!
I gave you links!
Thanks TONS, Ace
I got it to work
?
oh right
ace the links tell u to use table-cell
http://innonesen.se/test/l-2-txt/ ilovefedora
there is a solutionm
unlikely - then you haven't read them all
^^ what he said then
btw, good day , Ace_NoOne
hey mefisto - btw, that link looks hacky
Ace_NoOne, it is hacky
you dont need a url, its a basic 2 column 6 row table, and i want dotted borders, but not on the outside of the table
(as correct as i could think of)
hold on, there was something on hasLayout.net
]]]dotted
how dare you tell me I don't need an URL
dotted http://www.webdevout.net/browser-support-css#support-css2propsbasic-borderbottomstyle (IE 6: I)(IE 7: I)(FF 1.5: Y) (FF 2: Y) (Opera 8.5: Y) (Opera 9: Y) (Konqueror 3.5: Y) (Safari 2:
Y))
can someone take a look at my post, i'm trying to fix a div thats holding content http://pastebin.ca/663413
can you all take a look at this http://www.rwautomotives.co.uk and tell me what you think of the layout
use a proper pastebin:
]css paste @ cerberusaeon
Paste FULL CSS Code AND HTML code so we could VIEW your page. Incomplete code is useless: http://paste.css-standards.org , http://www.webdevout.net/test , http://paste.zoffix.com/
i don't see much there, ilovefedora
ok
u saw the layout, righ/
there is hardly any layout there - and the colors are horrible (just for testing I suppose)
basic. Good, but basic
colours are for testing
layout is basic
I think were all hapoing its just for testing ace
heh
but you all see the text. i want it to be absolute centre of every box
use IDs which expresses meaning/use of area , note3: use Strict doctype
why isn't it centered properly
@3
(hasLayout.net) HTML: Valid ( http://tinyurl.com/234tsk ) | CSS: Valid [134 warnings] ( http://tinyurl.com/3cjf32 ) | DOCTYPE: HTML 4.01 Strict + url | (MIME: text/html, text/html; charset=utf-8)
damn .. i hate dreanweaver
I told you to use a proper pastebin like the ones listed
i love i
t
EWWWWWW WYSIWYG!
@http://www.rwautomotives.co.uk/
(www.rwautomot…) HTML: Valid ( http://tinyurl.com/ytvlnd ) | CSS: Valid [7 warnings] ( http://tinyurl.com/2z5ur4 ) | DOCTYPE: XHTML 1.0 Trans + url | (MIME: text/html; charset=UTF-8, text/html;
charset=UTF-8)
did you get that
and embed your stuff properly
]bot @ cerberusaeon
bot: Hey! I'm a bot, dumbass!
oh
lol
whats wrong with that pastebin
it won't let us view the result
]paste @ cerberusaeon
Paste bins: http://paste.css-standards.org , http://www.webdevout.net/test , http://erxz.com/pb/ , http://sial.org/pbot/ , http://tnx.nl/scribble.plp , Upload images: http://oxihosting.com/pupload/
mefisto, evil!
it's ]css paste
and I already had ZB tell him
oh oik
whoops
great, now he's cross-posting in #web
sorry coming from java room
aren't those all valid rooms to post a question
yeah, have 10 people waste their time, great idea
you're already getting help in here
http://paste.css-standards.org
well, you were, until a minute ago
:sigh:
this one is hopeless
I'm starting to understand how trovster became what/how he is
well hold on
lol even ZofBot flees from this one
cool .. bot is down
btw, usually when i ask something in #web , i get banned
becausu i somehow manage to piss off OPs there
lol mefisto - I've had no problems there
usually by calling em incompetents and stupid
hah well, there you go then
.. that makes me wonder , how they got status ?
ok here we go http://paste.css-standards.org/23252
oh my god
LOL!
the problem is in the flightListTablecontainer div
http://paste.css-standards.org/23252/view does that look right to you
where is view?
oh
i posted the css in the same place
ORLY
you cant do css
HOLY CRAP mefisto
hey look, i've never used this post bin i didn't know there were extra rules, hold on
you cant do HTML , and you have no idea how to use JS
that page is a mess
where is the edit button
and you cant use web .. essentially
aiight so i'll just post the html
NO
post the HTML with properly embedded CSS
that's not hard ffs
it should be obvious
Heh.. its easier just to upload it O.O
Least then Mozilla will sexily syntax highlight it
that's what Firebug is for
umm ok so i posted the html
Thecks, are you from this planet ?
there is a VIEW mode for that pastebin
at the same place http://paste.css-standards.org/23252
OH FFS
http://paste.css-standards.org/23252/view
mefisto.. you have something up your ass O.o
DOES THAT LOOK RIGHT TO YOU
dude i'm not sure what you're looking for
all i have is code
I will show you a FUCKING EXAMPLE
i'm not uploading 100 images to ther server
then leave
you don't have to
you can use placeholders ffs
and this is really simple, its 4 divs and trhe positioning for them
because we cant help you if you cant show the problem
http://paste.css-standards.org/13202 and http://paste.css-standards.org/13202/view
is that so hard
i mean i have the code isn't that enough?
it's enough to piss me off
yeah i see your post
you need brain too
go find someone else
ummm
the only problem is all i have aregraphic images
that's what ALT text is for
i don't have text
find a new hobby cerberusaeon
its still going to be a blank page regardless
hey, does anyone know a free icon site? large icons such as a picture of a computer or something? i know it isn't really css but i don't know where else to ask.
Iconaholic
check wiki commons
Some great free icons there
they have some awesome ones
Really high quality work
crystal clear at commons
wheres commons?
Wiki commons
iconaholic
http://commons.wikimedia.org/wiki/Main_Page
Ace_NoOne is my Google bot
no, I'm a wiki host expert ;P
Sheep porn
thanks
http://commons.wikimedia.org/wiki/Crystal_clear
see..
could someone ban him ?
so you guys are saying if i put the alt tags in you may or may nit be able to help me
mefisto.. ban who?
you
we're saying this:
Why?
]secret @ cerberusaeon
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.
direct your hate at the nub, not at the guy with silly but acceptable comments
ok i'll be back in 30 minutes
I won't
thats okay, maybe someone else will be here
you still don't get it, did you
do we have awards we can hand out?
=/
nothing comes to mind
too bad, I would have loved to hit this guy over the head with SOMETHING
How about, the worlds heaviest award?
if this turns into a My Penis joke, I will kill you, Thecks
O.o
Ace_NoOne, http://bash.org/?4281
Don't dig yourself a hole =p
i don't think you would want to hit me
lol yeah, I was looking for that
i'm 212, 6 ft bench 300 pounds
omg now comes the internet nub
212? feck
I thought the oldest person was about 114
so don't waste your time on the bench if you can train your brain
212 pounds
this explains your stupidity
its the fat .. all over your brain
well women love the body too man..can't be all brains
.. gone
http://paste.css-standards.org/23255 just look at the flightListTableContainer div
i swear it'll make sense
wasn't so hard now, was it
@
nope
(paste.css-sta…) HTML: Failed (5 errors, see http://tinyurl.com/28pmn6 ) | CSS: Failed (4 errors, see http://tinyurl.com/2twvqu ) [120 warnings] | DOCTYPE: XHTML 1.0 Strict + url | (MIME: text/html, text/html;
charset=UTF-8)
Thats better
… apparently it was
Readable now
not validating
though i'm wondering when you're going to ask for the actuall css
O.O
Your code as 120 warnings…
ffs cerberusaeon the CSS should be EMBEDDED
wait
can i post it in another file?
its in a style sheet
that's the last straw
really, cerberusaeon that was your last chance
aiight, i'll figure it out, just thought it might be quicker asking some of the gurus, but you guys want an entire website before you look at anything
evening all
You have about 20 errors where 20 things have the same ID
…
For a start, IDs should be unique and used once
hey there - now flee while you still can
they arte unique
ID "undefined_2" already defined.
… width="1" height="1" border="0" id="undefined_2" //td
ID "undefined_2" already defined.
… width="8" height="1" border="0" id="undefined_2" //td
Loads of em
it's hopeless - let him figure it out by himself then
dude those are from fireworks
and they don't matter
thats not even the issue
Read the topic! Validate first…
what is the issue
u could delete that from the page
thats why i didn't even post it from the start
i just need someone to look at the divs on the bottom
don't use tools that generate crap markup
whatever, I'm paid, i do what makes money
LOL!
Yeah, I cut up PSD with ImageRead.. select CSS.. look at the index.html it generates and delete it very soon after
I only just got here. Link to the page and tell me what the issue is
later guys, thanks for the help
"If I fill the foundations of your house with mud, I make more money…"
hah
ImageReady*
]scret
]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.
seriously, we've tried all that - it's hopeless
we walked him through 3-4 tries of using pastebin - he just can't do it
Why is the bots command character ]?
Just to be different? :p
probably to make it unique, to avoid triggering other bots
This is funny… I'm trying to talk to a REAL person at a support outsourcing firm…
lol
Had the Live Chat window open for hours waiting for somebody to answer… no such thing
from #web:
besides, chanserv is asking me to explain what I explained
Chanserv is not a real person
yes it is….
Lol
How did you do emphasis or strong emphasis on a typewriter?
on a…. excuse me?
TYEPWRITAH.
I would push the button REALL HARD
lol JDigital
Actually what I'd do is go back over the line and type over it
So that was what you did?
Yeah.
Seriously?
A better but trickier solution might be to nudge the paper ever so slightly to one side to create a bold effect
Usually on a typewriter though bold is kinda hard to do, so you would have used underscores.
Underline instead of bold. There was a character for underscore on the typeriter. That's why we have an underscore character on the keyboard nowadays.
What if.. you pushed the key down and grabbed the hammer of that letter and slightly smeared it? :p
Hi. {list-style: upper-alpha} produces lists like "A. blah" "B. blah". Is there a way to remove the dot from after the letter?
probably not
lol
wow this topic changed for the ancient
ok, thanks.
So the underscore would go UNDER the characters? Not like _empashized text-?
Its "Explore the history of your keyboard day"
Sigh. s/-/_/
now n days u can just buy a typewriter with a lcd and have it set to bold. Itll do all the work for you
in UseNet times, there was _underline_, *bold* and //italic//
use to have an old digital typewriter
Electronic typewriters.. I know those!
Correct. You typed your word, pushed the typewriter head back, and typed underscores across the line.
I thought italic was ^italic^?
In fact it's still standard practice nowadays for authors to submit manuscripts using underline in place of bold, because that's how typewriters did it
not in my book, but standards might differ
I always think underline is untidy
Move over typewriter, IRC is the new generation
Goes for IRC as well…
exactly
bold underline
No damn italic though
Stupid non-standard IRC formatting.
my professor used to say "I hate underline in papers - makes me wanna click the paper"
Lol
no kidding
lmao
Bold is so much better than underline
depends, really
it's different
gotta love strikethrough though
I instinctively feel like clicking or tapping any text that is underlined.
Lol
hah yeah, I miss sstrikethrough
ever been to a website with strikethrough as a link?
strikeIRC should be HTML/strike
boy that sucks
wonder if that page ever gets any hits lol
is evil, Thecks
Yeah.. "Oh theres a link… nope its been struck out.."
"Oh no.. I'm surprised again.. IT IS A LINK!"
lol
and the poor author is thinking …. "why does my site not get any hits"
Strike through on mouse hover is CSS abuse!
greetingHello/greeting, subjectguys/subject. questionWhat's directionup/direction?/question
kudos to whoever turned this conversation from a looming flamewar to an enjoyable discussion
I think that either happened when the guy left
Or when the subject of type writers was bought up
* Bluuu has joined #CSS
How did you do emphasis or strong emphasis on a typewriter?
Thanks to Bluuu's randomness
it was bought up - damn, now we have to pay patent fees
Nooo =[
Ace_NoOne.. lets go ask Google to side with us
just learn to avoid typos then
Uh?
Or when the subject of type writers was bought up
ohh
Haha.. laugh at my expense
lol
funny typos ftw
Still waiting for the Live help of the support outsourcing firm…
Where did that cerberusaeon guy go, we never got to help him out
He was beyond help…
But he said he will be back in 30 minutes a while ago
seriously, be GLAD you weren't here when he posted his stuff; he managed to mess up three or four pastebins, without ever understanding what was wrong
So I'm sure you will have a chance to help
and that was just one thing…
clearly he needs an expert like you or I
Thecks, mefisto and yours truly TRIED PATIENTLY
but he really, litereally was beyond help
*literally (nice typos ftw
)
Did he explain what his problem was
sort of
I came in just as you were grumbling at him for not validating
he didn't manage to do anything right, seriously - I am usually very patient and understanding
http://www.youtube.com/watch?v=OjUX7YOP_Kk
Of course you are
too bad, I would have loved to hit this guy over the head with SOMETHING
"I am usually very patient and understanding"
everyone has limits
is there a way to define a border image for a div?
like a top and a bottom image
http://www.bigbaer.com/css_tutorials/css.border.image.frame.styles.htm
ummmm
Perhaps?
i dont think so
position @ Nyture
hmmm
]position @ Nyture
N/A
what are you looking for
can firefox not do .class image{ border: 1px solid #000000; }?
hi fellows !
is the a page on what position properties do?
it's IMG
it can, im using it now
wanderingii, I think he means to have a border made with an image
cerberusaeon, did you check the link a gave you?
i just want the image to have a border but not the div the image is in
left; wifth: 50%", to make a 2-column layout; everything is fine, but when I add a border-right of say 2px to my left div, the other one gets pushed underneath
yeah, can the inner div (content) stretch vertically
cause its really a content box i'm making
No idea, read the page
It was the first google result for "css border image"
-.-
so I'd like to have my right div automatically stretch to the right end of the page; is there a way to do that ?
that's why we have ]]foo
]]foo
[Google] http://en.wikipedia.org/wiki/Foo (More results: http://tinyurl.com/3exk76 )
max" to tell it to stretch, but it's not allowed
block elements (e.g. DIV) do that by default (if they're not limited by their ancestor)
my right div, which has no ancestor, is only of the width of the text it contains
then you are using float or abspos
yes, I said that I use float: left for the both of them, ot have a 2-column layout
oh right, sorry - link us please
or use pastebin:
]css paste @ Seb
Paste FULL CSS Code AND HTML code so we could VIEW your page. Incomplete code is useless: http://paste.css-standards.org , http://www.webdevout.net/test , http://paste.zoffix.com/
unfortunately it's only internal as of now
thus the pastebin; use a minimal example (strip out all unrelated stuff)
oops
Well.. cheap crappy ear phones
ah, cerberusaeon is back.
cerberusaeon, what appears to be the problem
how could i get 2 divs to be side by side?
]float tutorial @ Bear10
float tutorial: http://css.maxdesign.com.au/floatutorial/ , http://phrogz.net/css/understandingfloats.html
display: inline; or float as noted above (or both)
bottom?
no….
hmmmm
you might be able to absolute position… bottom: 0px; or something?
right works for attaching my image to the right side, but how do I attach an image to the bottom of the page?
relative; on the parent element, and position: absolute; left: 0; bottom: 0; on the element itself
I usually just put it as the last thing on the page, problem solved
anyone here used imagick before?
heh
it is the last item on my page
and i'm talking about the command line
not the php functions
http://paste.css-standards.org/23261
there you go
looks good to me
100%
but 49% is too small, since 50% + 2px + 49% 100%
you know the overflow: hidden; trick for floats?
i don't
absolute; bottom: 0px; worked, but it overlays on my layout if the browser is too small
how do I make it go behind?
Tried zindex to no avail
hold on seb
NM
fixed it by moving the publish your images online element above the layout
http://paste.css-standards.org/23262/view
i have a wrap that expands 100%
but when the layout gets smaller
it does as well
hrm
that's because % is in relation to the ancestor
not sure how that can work for me
z-index: -1; (I still haven't tried this to check)
I got it. I just moved my image element up in the code to above the layout
hmmm, I guess I know why
awesome
then div
but not sure how to solve it, except by adding additional wrappers
i want it to be like body
if i have an image , it will go across the whole thing
so for a floated block, not way to make it stretch all the way ? Damn
]shrink @ Seb
oops
that was ambiguous
]css shrink @ Seb
CSS Shrink Wrap: http://www.brunildo.org/test/ , http://www.brunildo.org/test/shrink-to-fit.html
maybe that helps
i guess min-width: fixed it in firefox
and it was fine in ie
can you stretch a image with css? like have it fit the browser window no matter the size? (say a BG image)
no
but stretched images look bad so you probably don't want to
unless theyre vector images
Nyture, http://www.cssplay.co.uk/layouts/background.html
im just wondering if its possible
ty nowimproved
np
not that I know of
JD check out now's url =P
oh huh
remarkable
yea right
ok im heading off a bit
cya
this guy cerberusaeon keeps showing up and then disappearing before I find out what his problem is
q.e.d.
how do i specify the width and height of a div?
100; height: 100;
or more complex?
100%; it does 100% but it goes even passed the end of page because its below other divs, how can i fix this?
]fullheight @ Bear10
fullheight: DECENT: http://phrogz.net/CSS/valign_in_body/block.html LAME: http://www.alistapart.com/articles/fauxcolumns/
you're missing the unit (px, em, %)
Ace_No0ne, yeah thats what im using
you want to substract, say, the header?
yeah
hmm, not sure whether that's possible without JS
URL?
sec leme upload
http://www.mydevsite.net/Shant/
best viewed in ff
'course
looks nice
my first attempt at a CSS layout lol
I like the colors
thanks
]zip @ Bear10
Start every stylesheet with this: * { 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
FYI
thanks
not sure how to do this … although there's probably an easy solution
but then, it might be impossible with CSS
there has to be a way
can you do negative bottom margin the size of the header
k let me try
wtf is http://www.mydevsite.net
dunno
lol not mine
how did you upload your stuff there then
margin-bottom: 122px; right?
negative margin
my bad yeah still dont work
:/
guess you'll have to wait for the Real Experts then
cause when i dont have the headers it does 100% right
probably - try looking at http://www.zoffix.com/new/to-page-bottom.html
maybe that helps
hi there
somebody around who has experience with layouting with CSS?
you know, those things which are nearly impossible to do with CSS like a simple 2-colon layout?
that's not hard
well, it looks like…
i tried anything and nothing works
there are too problem
s
nope didnt help o well
if i use float:left for the left colon and then the rest i am required to use margin-left:XXXpx to avoid the content colon to float around
but what if the size of the colon is not know?
simple two-column layout coming your way in 10 … 9 …
http://paste.css-standards.org/23262/view
another problem is if i use a nested float:left inside the content and i use clear:left i drop back out of everything instead of staying inside the content colon
i can do this kind of layout but as soon as there is a nested float:left inside everything breaks
for example i want to use in my page a small summary panel which is formated as window
it's destined to float on the right side and the content around it
yes, that's a problem - if you absolutely need that, you will probably need to use abspos
well, in that case i'm forced to go back to tables then
i wanted to avoid tables for my layout if CSS can handle this in a fluid way
absolute positioning works great
*shudder*
so for example the users have to be able to define what blocks of content they want left or right with the content in the middle
so some might have only the middle while others have up to all three
but i can not use absolute values then since i don't know the width of these colons
you can only solve either one of your problems, not both
also people with large fonts should not be blocked out ( bad web design )
so it looks like tables are the only solution to get a somewhat fluid layout then?
no
why would you need clearing in the contents
like mentioned, because of floating elements
for example some user puts an image in his article
and the text floats around but only one paragraph ( the quick summary ) and then wants a break
]clear @ LordOfDragons
Contain floats: http://www.ejeliot.com/blog/59 , www.positioniseverything.net/easyclearing.html
maybe that helps
http://dragengine.rptd.ch/module.php?id=17
if i though use two colons and a clear after the first paragraph i drop out of the entire page
which is one of my biggest headaches so far
read what I had ZofBot tell you (the first link)
wow i hate this stupid problem -_-
hm…
i'm a bit confused now…
so are nested floats possible or not?
since whenever i tried using them in my FX it fails
and it's the most recent version
just bad tutorials or really not possible?
of course nested floats are possible
because of this quote:
"The W3C float specification requires that a cleared element shall stay below all previous floats. There are no exceptions to this requirement! "Previous" in this case means any float that comes earlier in the source document."
– how would i select this element?
so it is not possible after this quote… i'm confused
what's not possible? Clearing isn't floating.
Elements with clear:; enabled…
take a simple example
you have a div (float:left) and another div besides it
without inserting an id="foo"
See, now that's a different question all together. Instead of being vague, why don't you just ask the full question?
inside the div you have another div(float:left) which has say an image hosting and on the right another div that has some text
kinda a news-page if you wanna put it this way
What? Me?
er, sorry. I meant LordOfDragons
it's early
heh.
so if i clear from the news-text i have ( after this quote ) to drop out of the entire layout
linky?
not possible… or did i miss something?
I have no idea what you're talking about, LordOfDragons… Link to the page and -show- us what you want to do.
You can't selectively clear things. If that's what you're asking. But that doesn't mean your layout isn't possible.
does ie have issues with using z-index?
hm… i don't have a page with "exact" this right now just a "hacked" one
where i used a fixed size for the inner float
this works… well… unless you use it on opera or IE that is
Show us code.
so if you increase the font size all is fudged
Er, wait. Why?
due to the fixed size
it had been the only way i could get a two-colon box inside another two-colon box ( the page layout )
Why don't you use ems instead of px?
but that's not much the problem here. since i found no solution nowhere i considered this impossible on css
But anyway, Show us the bloody code. instead of blathering on about how it doesn't work. We're not psychic.
]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.
U_U
not read? i said i don't "have" this page right now
i'm trying to avoid designing a heck lot long time on a page just to see it doesn't work
i have already played with float and css around on other pages
so i know a bit where i could expect troubles… and this is for example how to make a two-colon layout which is liquid but not fails if inside somebody uses a float
If you're unwilling to code a test page, stop carrying on about how your non-existant page doesn't work. Since it obviously doesn't work, it doesn't exist. You're wasting our time. It's rude.
i sent you a LINK!
but okay… nobody cared… i see
Where? we've asked for a link, and you didn't respond.
DAMN IT!
it had been up there
already scrolled off the screen .=.
hey Ace_No0ne you there?
uh-oh…
not for long anymore
aw, k
why
found a solution to your nested floats?
wanted you to try and help me out with somethin
no, because i'm currently attacked from all sides
why me specifically? just ask the channel; I'll help if I can
instead of answering a "simple" question
true lol
lol welcome to the interwebs
well ive got this image http://img250.imageshack.us/my.php?image=ehdc7.jpg (my layout) www.mydevsite.net/Shant/ i need help figuring out a way to get that shaded part
until a minute ago, we were trying to wrangle said 'simple question' out of you.
the one below the header?
you guys don't have ears, right? i repeat
yeah
on the left and right side
so i know a bit where i could expect troubles… and this is for example how to make a two-colon layout which is liquid but not fails if inside somebody uses a float
wrap a container around the entire non-header stuff and assign a bg image (top aligned)
column, not colon. And like I said, until a minute ago…
so has somebody already "experience" ( or made something working ) which is this
Give the left and right sidebars background images?
Where is the user content? left or right side?
the left and right sidebars are bg images
the content is in the middle
even easier: change them
but there "can" be something left or right, at the discretion of the loged in user
middle? You have two columns, there is no middle
for the start i tried two colons not three
column, LordOfDragons
since if you get two working three should be less of a problem
change what?
so for simplicity you can also simple say this:
the sidebar images - but why is everything done with images? why not container borders
It's really a whole lot easier for us if you ask your original question, instead of doing it one mini-question at a time. Since answers change drastically when taken in context than when taken outside of context.
left something ( you don't know ) and right content with possible floats in there
not sure i get what you mean, like i said its my first attempt at a CSS layout transfering from tables im having hard time lol
Put a background image on the container and make the content div white
http://www.mydevsite.net/Shant/images/col.jpg is not needed; you can have DIV { border: 1px solid #12345; } instead
so users can make articles with possible images in as well as a summary table
so i have to be a bit "flexible" at the layout to avoid people breaking it straight away
yeah i know but i just want to be able to do it with images b4 then
but for this i need to know if it is "in general" possible to do nested floats without breaking ( clearing ) an outer float
div id="nav" style="background: url(stripes) center top;"sidebar/div
is that an example or am i supposed to use that
you are supposed to adapt that
ok.. let me see that would be for the shader i assume
be sure you do url('file/path.whatever')
Hey ; )
do i need the '
cause its been working so far without it
you don't, but I also hate the idea of un-delimited strings
yeah, i usually use '
i will add it at the end
http://www.mydevsite.net/Shant/
does that stupid thing with the 100%, doesnt go all the way to the top looks ugly lol
huh?
see the shader?
yes
ok, see the left bar
yes
the leftbar doesnt go to the top, how it should
kinda like that header problem before
add some text to teh bars so I can see what's where exactly
k
refresh
better
wait what? why is the shader a separate container
because if its together it turns out like this
refresh
then You're Not Doing It Right
lemme try
ok lol
having better luck then me?
i kind of got it working with it seperate
sorry Bear10, sorta busy atm
might take a while
np
anywho if you get the chance to look at it, i got it working like this http://www.mydevsite.net/Shant/ only thing is we still have that 100% problem from top to bottom
that's a bad hack with the additional DIV
lemme try something now (I got a min or two)
k
that's serious divitis, Bear10
lol
I need to clean that out first
thanks for the help
in the meantime, Bear10:
]names @ Bear10
]css names @ Bear10
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.
o
also, do you need to use XHTML, esp. Transitional?
Hi folks! I have an image which is smaller than a div and would like to use it as a background, however I would like to set the background so it's to the right hand side of the div only. I can set the url() and no-repeat, but I'm unsure how to get the position to be to the right hand side.
I'm aware of background-position, but my problem is that the div isn't a fixed size. Any pointers greatfully received!
i dont use xhtml
url(pic.jpg) right no-repeat;
(at snazm)
That easy lol thanks matey
No problem.
I thought I was missing something
your doctype says you do!?
Cheers
eh dreamweaver did it, but i code as if i used xhtml anyway
so XHTML? or HTML?
html
k
hello
that's important, y'know
i didnt until i started wtih css lol, in php, html, js never had a problem not defining stuff like that
ive converted everything to divs
welcome to the World of Standards
hi
but now i cant place the two divs next to each other
rwautomotives.co.uk — look
:| gotta get ready to leave brb
I have a container (page) that is 570px wide. Unfortunetly, I need to fit some wide tables in it. That's not going to happen. I was thinking that maybe i could center the tables in relation to the container and have them overflow left and right.
PM me your mail address; I will send you what I have then (won't be a lot, but will make you understand simplicity wins)
Hello, if there is just one property for a selector, should it have a ; after it or not?
20px auto; seems to work. The problem is that i take them out of flow. So what comes next goes underneath them.
Any idea of a better fix?
]css overflow @ SpookyET
css overflow: http://w3.org/TR/CSS21/visufx.html#propdef-overflow
Might help?
jay.. the same can be asked about the last property for a selector
no
overflow can just cut them off at the ednds
ends
or put a scrollbar on
ideally you shouldn't put over-wide tables at all
I don't want to do that. I want to center them in relation to the container and have them overflow left and right.
okay true, so i guess it doesnt matter either way… it still validates… thanks
i don't put on there - once I read Joe Hewitt talking about the semi-colons being used to indicate there is another property and by omitting the semicolons on the last proprety you save the browser a little processing
oh okay thanks, i guess i wont do it either then
anyone help moi?
it's negligible
I don't think that's the truth. And I think most people agree it's a better practice to include semicolons
It makes no real difference. It's personal preference.
It's stylish and oldskool to omit them
but it's tidier to keep them
oh okay thanks everyone
which ones are are not the way you want them?
Do select fields in forms naturally have more height than regular input fields?
Any ideas? position absolute and margin: auto; would work if there was a way to force the following content to have a top margin equal in height with the table
Cant figure out how my select field is 1px larger than my inputs
hy
jsute a small reminder
i dont think i can help, but your page definatly shows up alot different in IE than in Firefox
if i have div class="right"table/table/div
and i want to acceess to table
what is the css for this
i've try
its navigation needs to be next to row 3
.right:table
.right table
ahhh okay
i'm stupid
Or table.right
] name
correct
]name
table.right won't work
oh well
thank
I put no margin on p for my header, and that works in Firefox… but in IE there is still a spac ebetween an image and my p.. how can i get rid of this? http://www.uniquelynorth.com/Uniquely_North_Web_Template.html
Jdigital, why not?
table.right matches table class="right".
not div class="table"table
thanks it was this
Ah, good to know
Why even specify table.right then?, why not just specify .right?
if you're using the strict doctype you will get a small space reserved below images. you can remove the space by setting the images display:block
Because he wants to access the table, not the div
if you have two elements classed rights
why would you use table.right versus just .right?
two reasons
1) in case you have anything else classed "right"
2) to remind yourself that it's the tale
tbale
table.
How would you force the content after an abosluletly positioned blocked to move down and not show up underneath?
thanks for the lesson
np
JavaScript? Measure the height of the block and add it as a margin to whatever comes after?
i don't like that solution
use a wacky hack to put a blank element in
or create a space equal to the table's missing amount
yeah, but that requires javascript
i'm looking for a css solution
for having that thing overflow left and right
I can't think of a way
560px wide means that anything wider will just not fit
so if it's 580, i need 10px overflow on the left, and 10px overflow on the right
instead of 20px overflow on the right
css overflow only lets you handle overflow by hiding it or or applying scrollbars
yes
however, { position: absolute; left: 0; margin: 0 auto; } gives me the effect i want. the only problem is that it takes it out of flow and content goes under the box
klined
I have this "border-top: 1px solid;" in one CSS file and I want to define it's colour something like "border-top: gray;" but the border dissappears. How can I do this then?
The colour in another CSS file. Forgot to mention that.
border-top-color: gray;
Thanks.
And thanks again for such a quick resonse.
border-top is a shorthand, needs color, style and width
No problem. Just happened to alt tab in the right moment .
Can I get an opinion of layout size?
http://img3.freeimagehosting.net/image.php?9e20284bce.jpg or http://img3.freeimagehosting.net/image.php?8252343ea3.jpg : Which is better?
I like the first one.
yea me too. But It doesnt allow alot of space for say, images
and its kind of tiny on a screen larger than 800×600
i guess i think id have to see something in it to decide, since im not sure what is meant to be in them, the one has two windows, and the first has 1 so i dont know if there is a navigation to be in the main image in addition to the one on top or what
Damnit, do form buttons and selects somehow have some built in extra padding?
well, there are going to be sub-menus for each topic. The two layouts differ on a dropdown menu or not
a good practice is to reset the browsers css, and then apply your styles. you can get a good reset css here: http://developer.yahoo.com/yui/reset
okay, i dunno, i like different things about boht
do tell
Ace_NoOne
Hi
I've got a huge image that I'd like to use as a background of this page
What's the difference between clientWidth, offsetWidth, scrollWidth, and which one is the most reliable?
But it's too huge for my resolution, so I'd like to make it fill the body tag, with any resolution
is that possible?
Nyture the wider one i like how your logo kinda pops out of the box and i like how the world portfolio is kinda with the line going through it or on top of the line, i think it looks kool, but i like the height of the box, and agree that it would allow more space for your content or images i
guess
wow that is hard to udnerstand jaybird
so u prefer the winder one?
*wider
nyture sorry i have a hard time saying things in a way that makes sense i think
Nyture i like certain elements of the wider one, but for actual page content i prefer the squarer one
its alright man
I do the same in R/L
thanks
You like how the logo pops out of the wider one, and how the word portfolio overlays the news box, *dont get the height thing*, and you agree the wider one allows for more space for images?
form or input atleast does seem to have some kind of margin of its own
atleast in IE…
i think the height thing was refering to the fact that i think the taller, more squarer, i believe the first one you posted, allows mroe space for images
theyre both the same height
really?…
…
oh no wait, your right
the first one is taller, but it doesnt matter. itll strech vertically
lol @ IE7 failure…. again
oh i see, if both of them stretch vertically, then i would think the wider one would have more room for images since its content space seems wider than the first one
* {background: transparent;} does this http://69.254.26.158/dru1/services
view in IE for a good laugh
it is winder. the main area alone is an extra 100pixel wide or so
overall I think its 200pixel wider
does anyone else see what im talking about?
i saw that the left coloumn seemed to be more to the right than in firefox, and that there were lines running down the left side of the page and maybe some space at the top of the left column that wasnt there in firefox.. or thats what i recall noticing
ok not sure what else to say
dont have to say anything, youve helped plenty
jaybird7, did it display the full content though? because over here its acting screwy
my menu headings dissapear
hey folks
when i mouse over the menu the bg's go white
i'm having loads of trouble trying to get ubuntu 7.04 installed on my t61
the video gets really messed up
let me look again
ok
okay ya i see that when i mouse over hte menu the bg goes white
ah and i also see now that the menu headings arnt there also
do the titles show up?
yeah, wtf bill…. come on
:P
its almost like it wont work at all
are you using javascript to make your login input fiels rounded
even if i just put it on the feild
jaybird7, no just css
i float the inputs off the top + right via absolut
the boxes are on the bg
and the inputs are all transparent with no border
the whole 1/2 part of that login and the background are just a png file
all the text and form elements are still there in text, but hidden, for the text only guys
hello! where can i found information on how to center an h1 or h2 ? thk's
ah i see thank you
akira2014, user the ccs text-align: cener;
on the h1 or h2
How do I change the colour of a text?
i don't work
#RRGGBB or color-name;
That seems to change the colour of my borders too.
help
akira2014, do the text-align on the parent element, or try makeing the h2 with=100% in html
if your doing html 4.0 that is
this is only slightly related to CSS but there's no one who can help anywhere else
(size) (type) (color) or border-color: value
would IE6 not allow relative sizes (percents) as a string?
Is that's the only way?
Polarina, yeah pretty much
thk's bobsomebody, now it work on IE7 but not in FF (i will google a litle)
www.w3schools.com/css/css_reference.asp
I just had a problem with mozilla firefox being unable to get the size of an image
akira2014, what you need to do is make the h1 bigger somehow
so I fixed the problem by changing it to a percent (I needed to resize the image)
or center the h2 from the parent element
but in IE6, it crashes
class before h2
wait i will try
take out the 100% thing thats a web hosting services with affordable prices fix sometimes, but its a roll of the dice ya know
hey guys/gals , whats the topic atm
css
smartas
s
bobsomebody, is there a way to get the image's width and height in mozilla?
no
I even waited until it was appended to the body, but it was still 24
(blank img)
and you shount be focusing on mozilla
why not?
because there are at least 5 major browsers out there
……
IE6/IE7/Opera/Safari/Firefoxx
firefox.
second x was for 'sux'
opera has about 1% though.
safari maybe 2%
IE6 maybe 18%
opera has less then 5%
most of it is IE7 and firefox
2-3% actually
IE6 has 35-40
FF has ~30%
Safari - les then 5% .. 1-2%
IE7 takes rest
i'm sure there's a way to get the size of an image in firefox
if there isn't, that's just stupid
lol
agamemnus, what do you mean? like return the width/height? or set it?
yes
return the width/height
hmm
what the hell is this
I changed button[i] from document.createElement('img') to new Image()
and now it works.
aaaaaarghr467nbft78g6ym9fg6b78fn7m9ms5n78bn678
hi
shit
it only works in mozilla
lol
do you have access to firefox?
yes
what positioning method do i want to use to center my form under my image at http://www.uniquelynorth.com/Uniquely_North_Web_Template.html please
i have written a javascript library. it's at tin-tags.org. Would anyone care to comment on it? ( beta reqires FF )
sure
thanks!
on a minute
in*
err - how do i change the size of a select-box? just like you can do "input { font-size: 1.5em; }" ?
simple "select { font-size: 1.5em; }" did the trick. But why doesn't "input select { font-size: 1.5em; }" work?
into input
learn your basic html at least
gaah - sorry. meant "input, select" of course
it sould be working in that case
(which works)
chech your page in firebug
just me making typos
maybe input or select gets overrided
aha
mozilla firefox caches images just too slowly
I loaded in the images in an earlier part of the script and it seems ok
agamemnus, you should take it to ##javascript
YAY
it's fine
i fixed it now
The Javascript gurus are all afk you see
byeeeeeeeee
which has a better flow. a menu bar on the right or left of a website?
Yo zoffix!
menu on left ir more etgonomical (spelling)
edi .. on right
ergonomical
hmr
aye
morning
evening
afternoon
but , this layout is something which is impossible to tell designer
they just cant believe
?
becase 'gods of web design - microsoft - has put menu on the left, so it must be right way'
=/
ppfttt microsoft
lawl
hi
having trouble with background-position in firefox
z-index: will make 1 background appear above the other?
no
will make one class or id apear at said level
ive set link background-position, and it has a hover img
the hover wont appear above the original in firefox
bobsomebody, what does it have to do with class or ID?
MaWanna, because your element is not positioned. And you are doing it wrong anyway
the class or id with the applied value will be adjusted
]rollover @ MaWanna
rollover: http://wellstyled.com/css-nopreload-rollovers.html , http://superfluousbanter.org/archives/2004/05/navigation-matrix-reloaded/
bobsomebody, what does it have to do with class or ID?
This is CSS not HTML.
ta
Is there a way to get the apparent background-color of an element with inherited background color? Trying to get it (with JS) only returns 'transparent'
i was repeating the background-image
Zoffix, are you just a buzzkill or what?
bobsomebody, excuse me?
to do css u use class and id alot anyways
sorry to be blunt
No you don't
….
You select classes or IDs of elements some times.. you are not applying z-index to classes or IDs.
s/select/select elements using their/;
i z-idndex by classes and ids
it works great
.oO( And you are a weirdo too )
not doing so is pretty stupid
using pure html ententies is great