I have a div with overflow:hidden, inside which I show a phone number as the user types it. The text inside the div is aligned to right and incoming characters are added to right as the text grows to left.
But once the text is big enough not to fit in the div, last characters of the number is automatically cropped and the user cannot se...
Is there a nicer way of styling a <hr /> tag using CSS, that is cross-browser consistent and doesn't involve wrapping a div around it? I'm struggling to find one.
The best way I have found, is as follows:
.hr {
height:20px;
background: #fff url(nice-image.gif) no-repeat scroll center;
}
hr {
display:none;
}
<div cla...
As web based designer who has designed web sites using tables but never with css, how can a novice get started with css?
Related SO posts
SO - Css Book & website for CSS
SO - Css blog
...
I have an XHTML strict page that has an invisible div that is controlled by Javascript. The div is set to transparent and visible by the script and a mouseover event to make the div opaque on hover.
When someone using a browser (or firefox with noscript) without javascript the div simply remains invisible. The problem with this is that ...
Although elements like <div>s normally grow to fit their contents, using the float property can cause a startling problem for CSS newbies: if floated elements have non-floated parent elements, the parent will collapse.
For example:
<div>
<div style="float: left;">Div 1</div>
<div style="float: left;">Div 2</div>
</div>
The pa...
Should links on a web page ALWAYS be underlined?
I do not believe this should be a hard and fast RULE!
I wrote a comment on my blog awhile back about this after another developer complained that I was not following web standards. It is coming up again, and I want to know what you think. Her argument was that for consistance and usabilit...
Is it possible to to change a <span> tag (or <div>) to preformat its contents like a <pre> tag would using only CSS?
...
Hi All,
I'm using JQuery's jquery.corner.js to create rounded corners on some td tags, and they look fine in IE EXCEPT
if you open a new tab and then come back to the page
if you go to another tab, click a link, then come back to the page
if you hover over a javascript-executing div / menu (I think).
The rounded corners are replace...
Given a template where the HTML cannot be modified because of other requirements, how is it possible to display a div above another div when they are not in that order in the HTML and both divs contain data that could produce a varying height and width.
HTML:
<div id="wrapper">
<div id="firstDiv">
Content to be b...
Before I explain what I'm trying to do, note that I have the good fortune of only having to target Webkit (meaning, I can use lots of neat CSS).
So, basically, I want to have a block with a flexible height, position fixed, maximum height being that of the available window height, with some elements at the top and bottom of the block tha...
I've been scanning through all the popular js libraries, but I can't find one that has a width function for a DOM element that actually accounts for quirks mode in Internet Explorer. The issue is that padding and borders don't get counted in the the width when quirks mode is engaged. As far as I can tell this happens when the doctype is ...
I find this incredibly annoying with Dreamweaver, everytime I go to save my document I have to tab into each css file and save them individually. Not a problem with one css file, but when you have 3 or 4 it is a pain in the ass. Is there anyway to save your dreamweaver document and all related css files in one hot key?
...
I'm building a new site for my company, and I'm at the stage where I've created the html mockup of the first page. I'm going to use this as a basis for the rest of the site. I'm thinking of organising my stylesheet better now I've got the design looking consistent cross-browser, but I'm wondering how far to go when I'm breaking it up.
O...
I'm looking for a simple Python script that can minify CSS as part of a web-site deployment process. (Python is the only scripting language supported on the server and full-blown parsers like CSS Utils are overkill for this project).
Basically I'd like jsmin.py for CSS. A single script with no dependencies.
Any ideas?
...
How do you keep numbered lists indented using HTML/CSS? I have a page where the digits are not indented and it does not look good.
Here is a sample page: http://php.wmsgroup.com/eofd6.org/volunteer.html
CSS is at: http://php.wmsgroup.com/eofd6.org/in.css
Thanks!
...
Here is the html code to a home page I am working on:
Freese Custom Homes
homes under construction
homes completed
development information
contact us
Floorplans
A list of our current floorplans, both rambler and 2-story. You can download a pdf of each ...
This is what I have, which works in IE7, but not in Firefox:
@media screen { @import 'screen.css'; }
It works outside of the @media block in Firefox:
@import 'screen.css';
UPDATE:
This works:
@media screen {
.yui-d3f
{
border: 1px solid #999;
height: 250px;
}
}
What am I missing?
...
I am trying to hide some divs before the user prints this giant form, then display the divs again afterward. Thus I want to ignore the rest of the page, and only print the form itself.
Sure I could open a separate page when the user clicks the print button. The only thing is that the form is really long and it would be quite tedious to ...
Hopefully a picture is worth a thousand lines of code because I don't want to have to strip down all of the ASP.Net code, HTML, JavaScript, and CSS to provide an example (but I'll supply what I can upon request if someone doesn't say "Oh, I've seen that before! Try this...") [Actually, I did post some code and CSS - see bottom of questio...
Given this HTML:
<div>foo</div><div>bar</div><div>baz</div>
How do you make them display inline like this:
foo bar baz
not like this:
foo
bar
baz
...