Skip to main content

Home/ CSS Evangelist/ Group items tagged floats

Rss Feed Group items tagged

anonymous

CSS designs using float | Developers Orbit - 0 views

  • CSS designs using float
  •  
    CSS designs using float
Hussain M Elius

jQuery Masonry - 7 views

  •  
    Masonry is a layout plugin for jQuery. Think of it as the flip side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically then horizontally according to a grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.
Frederik Van Zande

A List Apart: Articles: Faux Absolute Positioning - 0 views

  •  
    There are two popular approaches to positioning with CSS: float and absolute positioning. Both approaches have their pros and cons. My teammates and I have developed a new positioning approach that gives us the best of both worlds. After quite a bit of experimenting and testing, it's time to share the technique with the rest of the world and see how we can work together to improve it. I'm calling it "faux absolute positioning" after the faux columns technique that simulates the presence of a column.
Gary Edwards

Everything You Know About CSS Is Wrong | Digital Web Magazine: Rachel Andrew - 0 views

  •  
    The easy way to use CSS2.1 to solve difficult cross-browser layout issues: CSS tables solve all the problems encountered when using absolute positioning or floats to create multi-column layouts in modern browsers. Specifying the value table for the display property of an element allows you to display the element and its descendants as though they're table elements. The main benefit of CSS table-based layouts is the ability to easily define the boundaries of a cell so that we can add backgrounds and so on to it-without the semantic problems of marking up non-tabular content as a HTML table in the document.
kie guy

NealGrosskopf.com l CSS Template Layouts: A Simpler CSS Layout System, Now Possible Wit... - 1 views

  •  
    A new layout system to replace floats or display:table or html tables. Based on the W3C's proposed 'CSS Template Layout Module' for CSS3; but using jquery to take advantage of this technique today.
Alexis Sgavel

A new micro clearfix hack - Nicolas Gallagher - 0 views

  •  
    The clearfix hack is a popular way to clear floats without resorting to using presentational markup. This article presents an update to the clearfix method that further reduces the amount of CSS required.
thompsonmarry

Getting Started with Firefox extension - Diigo help - 0 views

  •  Feature Highlight: Highlights Diigo saves the day with "highlights". Highlights let you select the important snippets on a page and store them in your library with the page's bookmark. Let's try it. Just open a page, maybe one of your old-school bookmarks or one of your new cat bookmarks, and find the information on that page you actually care about. Select that important text. Got it? Okay, now put your hemet on, 'cause this might blow your mind! Click the highlight icon on the Diigo toolbar. It's the one with the "T" on a page with a yellow highlighter. You will notice that the selected text gets a yellow background. This means that the text has been saved in your library, and as long as you have the Diigo add-on the text will be highlighted on the page! How's that for easy?   Now you've highlighted the text. It will appear in your library within the bookmark for the page it is on. Go to your library and you can see how it works. If you're not sure how to get to your library, just click the second icon on the toolbar (Diigo icon to the left of the search bar) and then select "My Library »".
  • Sticky Notes on the Web What? I can put a sticky note on a web page? How? Oh, that's right! Diigo. Just right-click anywhere on the page and choose to "add a floating sticky note". Type up your note and choose "Post", then move the note anywhere on the page. You have to type a note first, before you move it where you want, otherwise there's nothing to move!
Frederik Van Zande

How to get Cross Browser Compatibility Every Time | Anthony Short | Web Design & Develo... - 0 views

  • Here is a quick summary for those of you who don't want to read the whole article: Always use strict doctype and standards-compliant HTML/CSS Always use a reset at the start of your css Use opacity:0.99 on text elements to clean up rendering in Safari Never resize images in the CSS or HTML Check font rendering in every browser. Don't use Lucida Size text as a % in the body, and as em's throughout All layout divs that are floated should include display:inline and overflow:hidden Containers should have overflow:auto and trigger hasLayout via a width or height Don't use any fancy CSS3 selectors Don't use transparent PNG's unless you have loaded the alpha
  •  
    Cross-browser compatibility is one of the most time consuming tasks for any web designer. We've seen many different articles over the net describing common problems and fixes. I've collated all the information I could find to create some coding conventions for ensuring that your site will work first time in every browser. There are some things you should consider for Safari and Firefox also, and IE isn't always the culprit for your CSS woes.
anonymous

13 Awesome Javascript CSS Menus - 0 views

  • 13 Awesome Javascript CSS Menus Posted in: Ajax, Javascript, CSS 31 Comments, Add a Response
Perry Branch

mezzoblue § CSS Crib Sheet - 0 views

  • Name classes/IDs based on function, not appearance. If you create a .smallblue class, and later get a request to change the text to large and red, the class stops making any form of sense. Instead use descriptive classes like .copyright and .pullquote.
  • When in doubt, validate.
  • When relying on floats for layouts, make sure they clear properly.
Jason Bao

Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for down... - 0 views

shared by Jason Bao on 14 Feb 07 - Cached
  • In November 2005 I presented on pro.html.it a three-part article on creating CSS layouts using techniques like negative margins, any order columns and in some case opposite floats. The main goal of the article was getting the maximum number of layouts based on the same markup, each with valid CSS and HTML, without hacks nor workaround and a good cross-browser compatibility. The result is a set of 40 layouts that we've thought worth sharing: on each of them you'll find also a download link (if you want, you can download the entire collection, 40 HTML pages in a single zip file). Further details can be found below the gallery.
yc c

Learn CSS Positioning in Ten Steps: position static relative absolute float - 0 views

  •  
    Good simple and important tutorial for anybody wanting to start CSS
1 - 20 of 22 Next ›
Showing 20 items per page