css

IE wrong paragraph using CSS float layout

Hi, I am learning XHTML and CSS and I got into trouble. On my learning page I am using CSS float layout. I have floted:left side menu, and to properly render text into content section I have set its margin to be exact same size as left menu. My problem is, that text in paragraph is wrongly shifted from the place where side munu ends. Thi...

Major IE8 positioning issues.

Hello. I know its a not a new concept that my site is perfect on FF,Safari and Chrome but jacked up on IE8. That being said and cutting to the chase. This is the home page that I am working on for a social network for people with CysticFibrosis. http://www.cysticlife.org/Home.php If you can, look at it in FF,Safari and Chrome, and the...

Is it possible to recolor an image using JavaScript?

Hi everyone, I was wondering if anyone knew of a way to recolor an image using JavaScript. Any type of access to an image's pixels would work, I suppose, as long I could read/write color values. It should work in Firefox; if it doesn't work in IE, no big deal, but it would be a benefit if it did. Thank you for your help! ...

Floating divs and unwanted space

I have several floating divs, which are graphically arranged thusly (their hierarchy in the code is indicated by numbers): (1)top left div - (2)div - (3)top right div (6)bottom left div - (4)div - (5)bottom right div All divs are currently floating left contained in a wrapper. The problem I'm having is that the bottom left box is lower...

Div collapses horizontally to width of widest inner element

I am having an issue with collapsing divs in CSS! But not the normal issue. That would be too easy. I have a left floating div which contains two left floated divs. The first of the left floated divs contains text. If the second inner floated div's style is empty, everything works fine and the outer div encompasses the text and both inne...

can I offset a bookmark inside a document/html?

I need to move all bookmarks inside the html page bit down. Is that doable? something like that <div class="anchordown" style="position:relative; top:-80px;"> <a name="learn">Learn bookmark</a> </div> but it doesn't work for me. The actual bookmark doesn't move at all EDIT I want to have the inside bookmark #learn to be displayed...

How to make element scroll with you on page?

I would like to create an element on a website that scrolls as you scroll down the window. In most cases, I know this could easily be solved with some basic css using fixed positioning. The issue is, I would not like it to be in the same space on the screen at all times. I would like it to be a sidebar element that starts with the rest o...

problem with parent() (jQuery)

problem with parent() jQuery Code http://webdev.faressoft.org/wp-content/plugins/ImageSlideShow/js/slideShow.js You can see the result here (Image Slide Show) http://webdev.faressoft.org/?p=208 $(".ImageNum span").click(function() { var image = parseInt($(this).text()); $(".correntImage", $(this).parent()).removeClass("correntImage")...

What's wrong with the positioning in this very simple example? (MS IE 8)

Here's the HTML <div class="panel" id="Panel1"> <fieldset style="position: absolute; top:8px; left: 136px; width: 136px; height: 48px;"> <legend> </legend> <div class="label" id="Label1" style="position: absolute; top:8px; left: 16px; width: 81px; height: 14px;">panel one</div> </fieldset> </div> <div class="panel" id="Panel2"> <fi...

Text in HTML input on FireFox 3.5 remains at top when height set

We need bigger text inputs for our forms, so easy enough, we just set the height on them... But Firefox 3.5 then keeps the text at the top. How do I vertically center it? On Firefox 3.6, IE8, Chrome and Safari, the text is vertically centered as I hoped. <form> <input type="text" style="height: 50px"/> </form> How do I make the text...

I'm using CSS3 animations with phonegap, and a specific tag isn't animating properly but works in safari/simulator

I'm using CSS3 animations within PhoneGap, an iPhone web-based SDK that enables you to create native apps using the web technology stack. The particular CSS animation I have below works in Safari, Chrome, and even the iPhone simulator, but for the life of me #image_cat1, #image_cat2, and #image_cat3 are not being displayed on the actual...

Should I style a DIV or its enclosed contents?

<div class="panel" id="Panel1"> <fieldset style="position: absolute; top:8px; left: 136px; width: 136px; height: 64px;"> <legend> </legend> <div class="Label" id="Label1" style="position: absolute; top:8px; left: 16px; width: 81px; height: 14px;">Hello world</div> <div class="tLabel" id="Label2" style="position: absolute; top:32px; lef...

Is there a way to make a semi-transparent div with dynamically placed "holes"

Hi there, I'm creating a page with 2 layers: an image layer and a "mask" layer on top of it which is semi transparent. I want to dynamically place a small rectangle "hole" in that mask so that the original image below it could be seen in that area. Is this possible? The final purpose a is to create an effect of a grayed out image that...

Stop word-wrap dividing words.

body { word-wrap: break-word;} I've been using that code (above) to fit the text in the body into it's container. However what I don't like about it, is that it breaks up words. Is there another way where it will not break up words and only line break after or before a word? EDIT: This is for use within a UIWebView. ...

HTML within a div takes parent HTML's CSS

Hi, I have an HTML as following: <html> <head> <style type="text/css"> a {color: red} </style> </head> <body> <div> <html> <body> <a href="#">Test Link</a> </body> </html> </div> </body> </html> "Tes...

javascript not working with HTML5

I started to implement some new html5 features (standards, nothing fancy) in my project. Just the standard header, footer, aside, ect. For some reason a javascript code that I used on a past project doesn't work now and I can't figure out what the problem is. I compared the code (html/javascript) with my new project and the past project...

web element inspector (safari / chrome) dimmed css properties

Silly web element inspector (safari / chrome) question, but I can't seem to figure out why some properties are dimmed. ...

Do I have divitis? WHat should I enclose in a DIV?

I am coding things like this <div class="panel"> <fieldset style="position: absolute; top:8px; left: 136px; width: 136px; height: 64px;"> <legend> </legend> <div class="Label" id="Label1" style="position: absolute; top:8px; left: 16px; width: 81px; height: 14px;">one</div> <div class="TLabel" id="Label2" style="position: abs...

HTML5 + CSS and setting the width of <HEADER>

I got the following css: div#header, header { height: 88px; width: 100%; background-image: url('/images/header.jpg'); background-repeat:no-repeat; } And the following HTML: <header></header> <div id="header"></div> The second HTML-line does exactly what I want it to do. However, the first html-line (< header >)...

Hover effects on irregular polygons in CSS

Hi, I'm wondering how to go about marking up and coding hover effects for a map similar to this image. When each district (or section) is moused over/touched/clicked I need to change the colour of it without affecting any other section. The boundaries on each section must be representative of the image and shouldn't be squares. The sol...