css

How to select an html element according to its child node attribute in css?

For example, in the following snippet: <tr> <td align="center">123</td> <td class="someclass">abc</td> </tr> I would like select all <tr> elements that have a <td> with the class="someclass". I am wondering if this is possible in css, without using javascript. Thanks. ...

How to add horizontal padding to every line in one multi-line wrapped sentence?

This is my code: <div><p><span>... highlighted text ...</span></p><p>Chapter info</p></div> This is what it currently looks like: http://i48.tinypic.com/2dqvo1i.png Is there a way to add padding to the sides of the highlighted text? Regular padding on the SPAN doesn't work, because it only takes into account the the beginning and en...

Rotate page slowly via CSS

Is it possible to slowly rotate parts of a page (in this case a single class) via CSS? My current code: .c1 { -webkit-transform: rotate(170deg); -moz-transform: rotate(170deg); -o-transform: rotate(170deg); } Unfortunately there is no way to use javascript for this, with the amount of access I have. Is there a way to rotate this c...

Make two fieldsets the same height

I have two <fieldset>s inside a single div (nothing else), that are positioned next to eachother (positon: absolute, div is set to relative). Is there any way to make these fieldsets both the same height without setting a fixed height? I have some idea that maybe I can make both have a max height of the parent, and a min height of auto...

Swap CSS style of a group of elements on click

I found a thread, http://stackoverflow.com/questions/195951/change-an-elements-css-class-with-javascript, that is along the lines of what I'm going for, but I don't know how to implement it. I have a page with 4 input buttons and two CSS styles: "Selected" and "notSelected". One button will be hard coded initially as "Selected". When ...

Resizing Page Elements based on Window size

Problem: My Client wants me to create a launch webpage for his product such that there should be no scroll on the page, be any browser or window dimensions. Doubt: Is this possible using CSS and Javascript? Some Early Diagnosis: This might be a little similar to this or this but the difference is that I want to resize the dimensions of...

Render a newline in my data inside a jqGrid cell

First off, I'm using version 3.7.1 with a jQuery UI framework theme. I'm trying to figure out how to have a newline or even a <br /> render inside of a jqGrid cell. An example of what I'm looking to have happen: ________________________________________________________ Item 1 | some data | Applies to OS 1 ...

jslint type tool for css

I am using JSLint to validate and inspect my javascript files. I find it very useful and helps me write better code. I have integrated it into Visual Studio through external tools. I am looking for a similar tool but this time for CSS? Any other there to look at, mostly to carry out same tasks as JSLint. ...

Form is not in correct position in IE7

http://www.campbellcustomcoatings.com/index2.php At this site, I'm using css3's box shadow and rgba for the content background. To make it play nice with IE7, i'm using 3 images. The Form element is cleared underneath the main content area and it's supposed to be to the right of it. Any body know why? ...

Right align first line inside a span element

I have a span, which is inside a div of fixed width. The span contains text that might wrap to more than one line. My problem is that I want the first line of text to be right-aligned, and the subsequent lines (caused by word wrap) to automatically left align with the first line. I.e., This is what I want to happen after a wo...

Fill available spaces between labels with dots or hyphens

Hello everyone, I have a page with labels which are contained in a div, the labels has a variable with and i want to fill spaces between both with characters, dots or '-'. For example. My label text 1 ----------- Some Text Here. My text 2 ----------------------- Another Text. If you notice both text are justified (or at least i tr...

css help with background using a body tag

I need to add this background to a website and this is the criteria. I'm not sure what the right codes are, everything I try the background won't appear. Do I need to make a div or do I just put this info in the style section. Body tag The path to the background image is images/grunge2.jpg and it’s position is -40px and 0px. The font fa...

:last-child issue when adding a footer after a section

Right, so this is strange. This code works as expected: HTML: <section> Section #1 </section> <section> Section #2 </section> <section> Section #3 </section> CSS: section{ margin-right: 30px; } section:last-child{ margin-right: 0; } The first two sections get a right margin of 30px, while the third section doesn...

CSS question - Specificity and interitance

Why in the following code world is blue rather than red ? The specificity of .my_class is 0,0,1,0, but it inherits the color of #my_id which specificity is higher (0,1,0,0). HTML: <p id='my_id'> Hello <span class='my_class'> world </span> </p> CSS: #my_id { color: red; } .my_class { color: blue; } ...

Split a table cell vertically

I've got an HTML table, where some cells have dynamic content that will change height over time. Let's say I want to have one cell fill the bottom half with one color and the top half with another color. I'd like to do it with HTML/CSS such that as the other cells change height, the color cell will adjust to still be half-and-half (i.e...

Get the Size of a CSS Background Image Using JavaScript?

Is it possible to use JavaScript to get the actual size (width and height in pixels) of a CSS referenced background image? ...

Aligning the baseline of field labels with the baseline of text in text inputs

I'm displaying text inputs next to some label text in a fieldset. I'd like the baseline of the text in the text inputs to line up with the baseline of the label text. I could set a fudge factor padding-top for my .label elements but the content of my .value elements may contain read-only text and this would screw up the label/value basel...

Height in percentage problem in HTML

When the following is rendered, the height parameter of image (img) isn't considered. However, if I vary the width in terms of % for example 80%, it resizes and aspect ratio is intact. If I mention height in terms of px it works. Problems occur only for height being in % and in all browsers. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01...

display:inline vs display:block

What is the basic difference between CSS display:inline and display:block. Using separately these on an element, I get the same result. ...

Dealing with repeated selectors: Placing elements together or using classes?

Let say I have to repeat the color blue in my web page, what's most effective, time saving, and smart way of doing it? Examples: 1. This example can mess up a little bit my css file. #header, #content, #footer { color: blue; } #header { (other properties) (other properties) (other properties) } #content { (other properties)...