css

Absolutely positioned div with width 100% is only as wide as the original window size

I have an absolutely positioned div that has a width of 100% with a background image tiling horizontally. When the browser is shrunk to the point that the width of the browser is less than the page, the remaining right portion of the div's background color is truncated. Is there a better approach or a hack to resolve this? Here's the ...

computing $(this).css(”width”) _correctly_ in Safari

Asked this question earlier today, but I think I awarded a correct answer too early. I'm trying to figure out how to grab the css length and width of an anchor element with jquery in Safari. But I keep getting "0" returned, and I was told that this was because the javascript is firing before the css is rendered - a quirk of Webkit browse...

Custom User CSS in PHP?

I would like to add a feature onto my site that would allow a user to choose between multiple styles. I am quite new to PHP but I'm guessing it would be able to be done. I've seen this feature on other sites. How would I go about doing this or could somebody refer me to a tutorial or guide on how this can be done? Thank you. ...

CSS: Full-size divs show browser scrollbars

Hi, I have a site which needs to be fully self-contained in the browser window, ie, the user must not have to scroll up and down to view different parts of the site. Content that is too long to fit into the content pane is handled with overflow:auto, which is working fine. the problem is, no matter what I try I still have the following...

problem with em unit

Hi, I want to use relative size instead of fixed size. I want to use em. My CSS is: body{ font:10px; } #wrap { font:1.2em; } #wrap ul li { padding-left:2em; } What is value of the li's padding in px? I would have guessed it's 2.0*10 = 20px, but it looks like it's taking 1em = 12px, I mean it taking it parent size. I wo...

Noob CSS Position Question

Hello, I'm trying to stack images on top of each other inside of a table. I want my page to look like the image below. As you can see, there are four boxes with a b&w number image in each. Hidden under the first box is a duplicate box with a color number image. Here's my HTML and CSS code I have... <div id="projects" class="p...

IE6: span (inline) with background-image

I'm trying to find a good why to display my Icons. I want to use a CSS and not an img tab. My code: <span id="Span1" class="iconPrinter"></span> .iconPrinter{background:url(../images/BWIcons.gif) no-repeat 0 0; padding:0 8px;} or .iconPrinter{background:url(../images/BWIcons.gif) no-repeat 0 0; width:16px;} It works fine on FF bu...

Padding within inputs breaks width 100%

Ok, so we know that setting padding to an object causes its width to change even if it is set explicitly. While one can argue the logic behind this, it causes some problems with some elements. For most cases, you just add a child element and add padding to that one instead of the one set to 100%, but for form inputs, that's not a possib...

CSS: parent div doesn't resize when its insides do.

I've got a simple CSS: div.header { width:auto; } div.footer { clear:both; } div.middle { margin:5px 0 5px 0; } div.links { width:200px; float:left; } div.content { width: 900px; margin-left:210px; } and a simple page: <div class="header"> <!-- some control inside --> </div> <di...

Change background of image maps on mouse hover

Hi, Iam new to CSS and Javascript. In my website I have an image as the navigation bar and have created hotspots to link them to different pages. The problem is since the text is a part of the image, I cannot change the style of the text on hover. Whereas I want the text/the hotspot to stand out on mouseover, so I learn the background c...

A questions about coding the CSS layout for a website.

Ok, I'm kind of new to standards of web design here. :P Is this the correct way of designing a site with CSS? Each "Box" has it's own DIV tag, with it's own settings. I'm guessing the background-image: of a box inside of the heirarchy gets precedence over the outer box, right? A "Box" that has the background image of the site. Anothe...

Getting uniform layout in both IE7 & IE8 with form elements

It would seem that IE7 puts an extra 1px of spacing above and beneath form elements. IE8, FF3.5, Chrome 2 & Opera 9.5 correctly renders these elements without the spacing. What I want though, is for the display to be the same in IE7, so is there some kind of workaround to get IE7 to correctly render the elements? It doesn't appear to m...

Expand an <a> tag to fill the space

How can I make the anchor tag expand to the bottom of the list item? I know I could put the anchor round the list item tag, but that breaks XHTML 1.0 Strict compliance, so I cannot do it. <html> <head> <style> #listWrapper { text-align:center;} #list { margin-left: 0px auto; margin-right: 0px auto; width: 100%; min-hei...

how can I use custom css style in the default theme of trac?

Hi, I have some trouble with my trac installation (version 11.4). What should I do to change i.e. some colors in the default theme? I've found various tips in the net, but nothing worked yet as most tips were for the 10.x version. Are there any options in trac.ini or should I add a special xyz.css somewhere in my environment? Please h...

CSS: max-height not working

hello, I have the following html/css code . When I have the screen resolution to 1024*768 the height is 400px.But when I change the screen resolution to 1600*1200 the height does not increase.I am using FF 3.5.2. Can anyone tell what the problem is ? <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http...

How to approach problem of creating graphic buttons with dynamic text for web page

I want to be able to create links looking like buttons with dynamic text and graphic bakground, these buttons also have to change their apperance on mouse over/mouse down and when subpage which button corresponding to is currently opened ame as mouse down) I want to avoid using - java script/jquery - server-side generated images - f...

jpg image not getting rendered in HTML.

Hi All, I have one jpg image which is getting rendered in FF but not in IE6. <img src="Image/warn.jpg" alt="aimage" /> Path is correct as this is working on FF. any clue? ...

IE7 cause of "Text - Empty Text Node"

I'm using the IE web developer toolbar to troubleshoot an issue. A blank white space is appearing below a list item, and I can't logically figure out why. Using the web dev toolbar, I see that in example 1 below, a "Text - Empty Text Node" is being output below "Text - Google". Ironically, in the second, with a space manually inserte...

Check for Background in CSS

I have a number of CSS attributes and Classes which get applied based on where the element appears in the HTML. However some elements do not equal any of these values so i want to be able to check which elements in a DIV do not have a background set via CSS then apply a background. Something like: $('.divclass:has('background')').addC...

CSS Colors: Depend on Monitor?

Do CSS colors render differently on different monitors? Most importantly, will tools like Digital Color Meter (on OS X, an eye dropper, if you will) give me a different hexcode depending on the monitor or graphics card? ...