css

CSS design for large form - Design Advice

I have a large form that consists of all the input (text, checkbox, radio, etc...), I have them grouped together in a fieldset tag and a legend for each feildset. Each input has a label associated with it as well. My question is what is the best approach to display the information on one screen and take advantage of the horizontal real e...

Dropdown menu hides behind other elements in IE

I have installed the Boldy theme from site5 on one of my projects and have run into one major problem. When browsing in internet explorer (8 or lower), the top dropdown menu gets displayed behind some other elements (main content slider, H1's etc.). I've tried everything from changing all the z-index's to fixed positions, with no luck. ...

Problem centering div with css

Hi all, I'm trying to center a div in my page but I have a very particular layout that doesn't let me center it with regular margin: auto properties. What I have is, basically this: HTML: <div id="container"> <div id="sidebar"> some text </div> </div id="content"> some text </div> </div> CSS: #contai...

Is there a limit on the amout of data while using image src as base64 strings?

I am trying to use base64 data string for images and for some weird reason some of the images are not getting rendered on IE8 or IE7 (I don't care about IE6), however they work fine on IE9 and FF (I tested on FF 3.5.0 and above). Is there any limit on the amount of data supported by IE as base64 data strings? ...

css postioning with images and text at top?

i have this li list which displays an image with the username right next to it: but the username is at the bottom, i want it to be at the top: just like this: the code i have is at http://www.jsfiddle.net/RpCUV/ with an illustration of my current code, i know this is a simple questions, but i'm new to this, thanks ...

Default CSS values for a fieldset <legend>

Hey folks, I'm trying to use a <legend> as a title inside a <fieldset>. In browsers other than IE, the <legend> is positioned on the top border of the <fieldset>, with the text perfectly centered on the line. I'm trying to reset it's position so that it sits just like any other element. i.e. an <h3>. Here's the CSS I have so far. ...

Regular expression remove tag after a paragraph with a given class

Is there a way to select all <br> tags that follow a paragraph with a given class? i.e. <p class="myclass">This is a paragraph</p><br> There may be other <br> in the HTML so I cannot use this: br {display:none;} and I cannot delete all <br> tags. If there is a way to select these particular <br> tags then I can use CSS. There are a...

Problems positioning footer with CSS

I just can't figure out the problem. My footer should NOT be able to go above my body. I can;t figure this out. Any help would be appreciated. Here is the link: link text #mother {width: 100%; min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -254px; } #page_wrap ...

Why do my login status links not render properly with BlueprintCSS's print.css

I am attempting to implement the BlueprintCSS grid framework in my app and after including the scripts it calls for my links are rendering weird. I have it narrowed down to the print.css. was wandering if anyone has run across this before. Here's what renders Logout (javascript:__doPostBack('ctl00$LoginStatus1$ctl00','')) Obvious...

Convert dropdowns to radio buttons w/o modifying HTML

So this is sort of an exceptional case situation - I have a plugin that I can't modify for contractual reasons. It displays a set of drop downs and I need it to display a set of radio buttons instead. Is there a js/jquery method for converting dropdowns to radio buttons w/o changing the HTML. Remember, I can add stuff - I just can modify...

Conditional change (if/then) based on css property in jquery

I have several images: <img class="photo" src="{{ img.url_small }} /> <img class="photo" src="{{ img.url_small }} /> <img class="photo" src="{{ img.url_small }} /> I'm trying to change the border color when the user hovers over the image or clicks on it: $(".photo").click(function() { $(".photo").css({"background":"white"}); $(...

Image wont render on my aspx page after adding master page..if not changed ID ..what else could be the reason?

used the following code to get rid of the system generated ID:- Banner.ascx.cs protected override void Render(System.Web.UI.HtmlTextWriter writer) { StringWriter Html = new StringWriter(); HtmlTextWriter Render = new HtmlTextWriter(Html); base.Render(Render); writer.Write(Html.ToString().Replace("id=\"ctl00_ContentPlace...

How to display html email in the browser without it changing my bg colors and altering my table

In a new app, I'm building, I want to display an html email in a table in the browser. The issue is that the html emails are changing the background color of my webpage and at times ends an html table I am using to display multiple emails. The emails usually contain full html, body, div, and table tags. A normal occurrence is an b...

Outline applied to an anchor containing an image isn't the right height in Chrome

For a site I'm working on, I'd like to have a dotted outline appear around links when they are focused/hovered/active. I'd like this to happen for text and image links. The issue I have is that whilst my code works great in Firefox and IE, in Chrome 7.0.517.41 the dotted outline is the same height as my text, not the height of the image...

CSS background opacity with rgba not working in IE 8

I am using this CSS for background opacity of a <div>: background: rgba(255, 255, 255, 0.3); It’s working fine in Firefox, but not in IE 8. How do I make it work? ...

Disable webkit's spin buttons on input type="number"?

I have a site which is primarily for mobile users but desktop too. On Mobile Safari, using <input type="number"> works great because it brings up the numerical keyboard on input fields which should only contain numbers. In Chrome and Safari however, using number inputs displays spin buttons at the right side of the field, which looks l...

Z-INDEX Problem in IE7

If you click the orange ORDER button at the top the #dimmer should cover the whole background and the form should appear at the top. (lightbox-like effect) The problem is that in IE7 the #dimmer would appear at the top regardless of it's z-index. In other browsers everything works nicely. Link: http://fenelon.ru/projects/SpaceFood/2...

JQuery Draggable and Sortable placeholder

Hi everyone, I am facing a particular issue with combining draggable and sortable. The problem has to do with a placeholder not showing when a draggable is moved over the sortable and the drop is not "recognized". This behaviour occurs when the sortable ul hs NO height defined in css. When i do define a fixed height in css for the #Sor...

Which Perl web framework should I use for a static HTML application?

I am about a develop a simple web application (5-6 static pages). Is there a framework I could use for this? I can just write these HTML pages without a framework but I would like a framework as it will better handle header, footer, and CSS throughout the website. I have a Perl script that will be modifying these HTML pages daily. And I...

Website displays badly in IE 8, but works fine in other browsers

Hi! http://test.rfinvestments.co.za I've been working on this website for a little while and, now that it's online, I'm frustrated with cross-browser compatibility issues that don't present themselves when I view the site from my pc. If you view the site in Google Chrome, you should see it exactly as it's meant to be seen. In IE 8, I'v...