Re: [css-d] clear: both + negative margin -- should it do anything?
On 3 Feb 2006, at 4:42 pm, Christian Montoya wrote: In my test case above, Firefox (1.5) and Safari (1.0 and up) are correct. Now that I see the latest standard, I concur. At least, as far as I can interpret it, that is: clear means add to the top margin a value equal to the height of the clear. If the margin is less than the height of the clear, then the added value will always result in the height of the clear, and it will always look the same. Only when the margin is greater than the height of the clear, nothing is added. So the first case is 0 + 80 = 80. The next is 80 + 0 = 80. The next is 100 + 0 = 100. The last is -1 + 81 = 80. That is the correct assessment for the value of the computed margin- top in those cases. Not a very helpful implementation I guess? ? The css 2.1 wording is quite clear, I think. As far as implementations go, Opera has still some work to do, and IE maybe (depending on how IE 7 handles margins, margin-collapsing, etc), and iCab. - Isn't an alternative also to give the floated element a bottom margin? If you want to make sure there is some separation space between the floated box and the (cleared) subsequent block, that is the way to go, as you never know how tall (computed height) the floated block will be, except if the height is locked in pixels (i.e. an image). Philippe --- Philippe Wittenbergh http://emps.l-c-n.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clear: both + negative margin -- should it do anything?
Philippe Wittenbergh wrote: http://dev.l-c-n.com/_temp/clear-marginTop.php ... In my test case above, Firefox (1.5) and Safari (1.0 and up) are correct. Firefox 1.0 does a slight poopoo with the neg. margin. IE 6 Win is half correct (test 2 and 3), probably more by accident. As for Opera, all versions tested are wrong, from 7.54 to 9 TP1, each in a different way. And iCab is wrong as well (add the specified margin to the clearing box, but consistent). Good old IE Mac is wrong on the negative margin test, can't blame it too hard, due to the ambiguities in the CSS 2.0 wording. IE 7 Win ?? (if anyone could post a screenshot, and file a bug if needed...). Philippe, IE7b2 http://www.satzansatz.de/phw/clearmargintop.jpg Best, Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] How close is MS from releasing IE7?
It is apparent to me that when they eliminated the * hack - they failed to replace it with the min-height command - which is a serious problem. Does anyone know if they are going to address the min-height command? See my email from earlier: http://archivist.incutio.com/viewlist/css-discuss/69824 As to when they are planning to release, you're better off checking out the IE Developer Center linked to in my previous answer for that kind of information. I have seen it suggested that it may not be until 3rd quarter 2006, but that's just random speculation by somebody with no inside knowledge, and is therefore worthless. Regards, Nick. -- Nick Fitzsimons http://www.nickfitz.co.uk/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Is IE7b2 particularly slow on a:hover ?
On this old bug page http://www.positioniseverything.net/explorer/percentages.html IE7b2 takes half a second to click in the background-color change on hover each time you walk from one section to the next (sections A-I), hovering the little colored squares. Once you have entered a section, the hover is as fast as usual. Is it just this bug demo, and IE7b2 requires lots of CPU time to correct the buggy margin-%-calculation? Or do you have experienced similar performance lacks with a change on hover on your pages? Ingo Btw: Section E example 1 still shows a jump on hover, to a wrong position this time. -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE 7
Just added a workaround for the whitespace issue to the wiki, can you please confirm that it works for you, too? http://icant.co.uk/sandbox/whitespaceBugMSIE7.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE 7
Christian Heilmann wrote:
Just added a workaround for the whitespace issue to the wiki,
can you please confirm that it works for you, too?
http://icant.co.uk/sandbox/whitespaceBugMSIE7.html
I may be missing something, but if you just skip the entire hack
and just apply
li a{
display:block;
width:13em;
}
all the examples display properly in IE7, 6, 5.5, 5.01.
(I've never used the height property to eliminate the gaps afair)
--
Els
http://locusmeus.com/
http://locusoptimus.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Inline styles and the people who hate them.
Troy,
on Friday, February 3, 2006 at 04:30 Troy Brophy wrote:
Now, the wonderful thing about this app is that it has dozens of pages with
unique designs. Each of these unique designs requires many elements to be
positioned, floated, padded, margined, bordered or backgrounded uniquely.
This has contributed in no small way to the 10,000+ lines of CSS rules for
this app.
If you need more than 10,000 lines of css for styling an app, my first
guess is, that you've done something wrong. I spent the last year in
styling a large scale enterprise application framework and we only
needed about 2500 lines of multilined css definitions.
If you really need to style each page individually, you should
consider to split the rules into different css files.
I would start with:
general.layout.css
general.components.css
And two files for specific IE rules:
general.layout.ie.css
general.components.ie.css
and probably enhancing it with group levels:
groupx.layout.css
groupx.component.css
And two files for specific IE rules:
groupx.layout.ie.css
groupx.component.ie.css
if you need to go down to the page level you could use inline styles
in the head, but IMHO it's better to add them to the group level
files. Add an id to the body tag of the pages and identify the
specific page by using this id.
If you have too many rules, you can add page level external css-files.
You should also go through your style definitions to identify
duplications.
- Use inheritance as much as you can!
- Think about every class and id you use, if you really need it, or if
it will be enough to use the id/class of the container.
- Write the rules specifying as much as the html structure as
possible/necessary. This will help you to find a specific rule, if
you have to change it.
like:
#layoutWrapper #layoutHead #layoutLogo a img { styles... }
- Use namespaces for names of classes and ids
I hope that helps...
regards
Martin
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Inline styles and the people who hate them.
Martin Heiden wrote: If you have too many rules, you can add page level external css-files. Personally, I cannot see the purpose in having page-level external files in addition to shared group-wide or site-wide files, except for one thing: media types. If you link to external style sheets you can reliably use media types. If media type is not an issue in the situation, I would put the page-specific rules into the head of the document. This is quite appropriate within the intent of CSS, in my opinion, and makes finding the relevant CSS much easier. You should only use external CSS when the rules are for sharing with other pages, IMHO. Otherwise you are adding inconvenience without gaining any corresponding benefit, and it means an extra server hit for each page viewed - completely contrary to all the normal advantages of using external files. Keeping the rules within the document allows you to use sensible global naming conventions within each page like... #content ...and provide unique layout values without needing to apply unique IDs to the BODY tag or similar strategies, which can be a real pain in the butt to administer across large sites. Another reason to be careful about over-centralising CSS is testing: we had a situation on a very large corporate JSP-based site where the whole site was being made-over to a new look across several months. Chunks went through unit and functional testing and were then staged for final production use. Before we realised the risks, we had a couple of situations where later changes to the shared CSS caused layout of pages that had already been through testing to break. This was extremely serious, because testing was about 40% of the work on each page, and retesting everything would have added weeks or months to the project. We had to split CSS up so that each chunk that went through testing would not be affected by later changes to the CSS, but within these chunks you could still have problems. CSS seems to be almost unique in introducing risks on this scale on large workflows. HTH Cheers Ian PS - I second the sentiment of others that if you have thousands of lines of CSS in any single file, something has gone wrong almost by definition. -- _ zStudio - Web development and accessibility http://zStudio.co.uk Snippetz.net - Online code library File, manage and re-use your code snippets links http://snippetz.net __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fluid design width problem
Jared Lyon wrote: Hi all, I seem to be having a bit of a problem getting a div to fill the width of the screen. Here's the trouble page: http://www.rit.edu/upub/new/contact_us2.html Can anyone help me get the maincontent div to fill the remaining width of the screen, instead of it just being 400px like it is now? It's actually 500px, because you have a rule for it that says width: 500px; :-) In order to get it to fill the width of the page, you have to leave a width off, and you can't float it. If you float it, it will expand to the width of its content -- and you have a bunch of blocks in there that want to be 100% of the window. They successfully become 100% of the window and push #maincontent down in the process. So, remove the width and the float and apply margin-left: 180px to #maincontent. Your new problem then becomes that the clearers you have within #maincontent are clearing the #sidebar too. This is because #sidebar and #maincontent are in the same block formatting context. You need to create a new block formatting context for #maincontent so that clearers within it pay no mind to #sidebar. The float you had on there before was establishing a new context, but it was unusable with a fluid layout. Luckily, you have several different ways: http://www.w3.org/TR/CSS21/visuren.html#q15 I applied display: table-cell to #maincontent in Firefox and it worked great. If this doesn't work in other browsers, you can try display: inline-block on them. And as always, any other comments on the site are welcome as well. I think it's a great design and will be a lovely example of liquid layout. Shoot me an email when it's launched so I can bookmark it, ok? :-) Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE won't let static content move up to flow around floats
Ingo Chao wrote:
Zoe M. Gillenwater wrote:
http://www.pixelsurge.com/experiment/ie-float-clear-bug.html
I'm absolutely not sure, but it looks like the problem on that page
and the fix I am suggesting are somehow related to what Bruno has
described here
http://www.brunildo.org/test/IEWfc.html
It seems related, but kind of flipped on its head -- this page is
documenting the familiar bug in IE (and earlier Opera) of floats moving
up higher than previous floats. The bug I was looking at, on the other
hand, was about static content not moving high enough -- seemingly
over-aggressive clearing.
.clear_solvent {float:left; width:0px; height:0px;}
div id=right-float-1
pThis div is floated to the right./p
pLorem ipsum dolor sit amet,.../p
/div
pstrongThis paragraph is not floated .../strong/p
div class=clear_solvent!/div
div id=right-float-2
pThis div is floated .../p
/div
pstrongThis paragraph is not floated and sits in the source
after the second right float. .../strong/p
Seems to work in my browsers, including IE7b2.
I can confirm it works on IE6 and IE7b2. Thanks so much Ingo! I
thought it would be you to fix it. :-)
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One True Layout
Rob Cochrane wrote: Hi List, I am experimenting with Alex's excellent 'one true layout' to dynamically change from what is effectively a Left To Right layout to a Right To Left one. I have set up the style sheets such that the common items are in one and I switch via PHP those that influence the layout. Layouts are 2:1:3 and 3:1:2 All is great in FF but in IE one layout crashes and I have overlooked something or something is causing the error. The problem occurs when one selects Arabic (thus changing the read direction and switching CSS) as the language and submits in IE (6 and 7) the 2nd and 3rd columns pile to the right! Page: http://demo.by-rob.com/BasicTemplate.php CSS: http://demo.by-rob.com/css/basiclayout.css http://demo.by-rob.com/css/layoutRTL.css http://demo.by-rob.com/css/layoutLTR.css If you would be so kind as to show me the error of my ways Many thanks Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ Hi All, I am beginning to despair is there no one within this august body that is able to offer some clue, original author included? Perhaps it is the M$ IE7 madness? Rob __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fluid design width problem - using display: table-cell to solve a clearing issue
[--- Le 03/02/06 13:56, Zoe M. Gillenwater a écrit : ---] :
So, remove the width and the float and apply margin-left: 180px to
#maincontent. Your new problem then becomes that the clearers you have
within #maincontent are clearing the #sidebar too. This is because
#sidebar and #maincontent are in the same block formatting context.
You need to create a new block formatting context for #maincontent so
that clearers within it pay no mind to #sidebar. The float you had on
there before was establishing a new context, but it was unusable with a
fluid layout. Luckily, you have several different ways:
http://www.w3.org/TR/CSS21/visuren.html#q15
I applied display: table-cell to #maincontent in Firefox and it worked
great. If this doesn't work in other browsers, you can try display:
inline-block on them.
Very interesting, Zoe. I was testing something like that this day and I
didn't get this solution.
display: table-cell applied ti #maincontent works on Opera 8.51.
To avoid any problem with IE, I have added through a conditional comment:
!--[if lt IE 7]
style type=text/css
#maincontent {
height: 1%; /* holly hack */
display: block; }
/style
![endif]--
The holly hack seems absolutely necessary, display: block is rather
an additional security.
It works fine as well on Netscape 7.02 (Gecko 1.02) and Mozilla Firebird
0.7 (Gecko 1.5) but amazingly, it works for these two brothers even if
display: block is applied to #maincontent.
Amitiés
--
Philippe DE MOURA
phdm
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] background-images alignment questions
On 2/3/2006 12:35 AM August Shamino wrote: Some web pages divide a background-image across several elements, so that it looks like just one image. How can you do that safely with CSS? In a cross browser way? Especially if you want a particular element's background-image to line up with the body's background-image, pixel perfect? Most (but not all) of the time I find it better to leave background images in one piece, but the question of how is pretty hard to answer without something concrete to look at. If you could provide a URL to a page you're working on we might be able to help. -- Steve Clason Web Design and Development Boulder, Colorado, USA www.topdogstrategy.com (303)818-8590 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Horizontal scroll in IE (6/7 Beta 2)
Hello All, This is driving me nuts! Why does my page get a horizontal scroll bar in IE7, and even in IE6 for that matter, when you view the site at 800x600? Firefox/Opera are fine. The XHTML/CSS validate, as well as AAA. Best Regards, Martín Espericueta Standards Evangelist / Web Designer / Information Technology Admin (@ times) / San Francisco Bay Area Central Valley Web Design Standards http://fiercestreetnetworks.com/ Web Accessibility http://fiercestreetnetworks.com/web-design-tips-tricks/accessibility/accessi bility.html XHTML CSS http://fiercestreetnetworks.com/web-design-tips-tricks/xhtml/xhtml.php Search Engine Optimization tips http://search-engine-optimization-tips.fiercestreetnetworks.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Portfolio display issues (design.zooibaai.nl)
Hi all, I redesigned my portfolio http://design.zooibaai.nl/ last week and was convinced it didn't look _that_ awful in IE. Then I saw this screenshot http://browsershots.org/job/738825/ and wondered just why a local IE6 testbed didn't display this wicked freak show. That's not important right now, however. I want it to either approximate the proper layout http://browsershots.org/job/738826/ or look okay enough (something like previews under titles, description a tad wider, but then with clearance on the elements--IE refused to listen to my rules when I was able to check). If anyone has a fix or even a ridiculously wonderful tip as to where the problem is, I would be pretty grateful. Thanks in advance, Rob. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE7b2 breaks the alternate box model hack: comment bug fixed, but not !important
Testcase http://www.satzansatz.de/cssd/ie7b2_abmh.html In What’s New for CSS in Beta 2 Preview? http://blogs.msdn.com/ie/archive/2006/02/02/523679.aspx Markus Mielke said they have fixed the comment bug: property /**/: value; value is now recognized by IE7b2 (like in all browsers but IE6). But !important is still ignored, valueB overwrites valueA property: valueA !important; property: valueB; This wild fixing of only /half/ of the bugs breaks all pages that make use of the alternate box model hack. http://www.info.com.ph/~etan/w3pantheon/style/abmh.html#tech3 Well, in Call to action: The demise of CSS hacks and broken pages they have warned. http://blogs.msdn.com/ie/archive/2005/10/12/480242.aspx In Molly's Star HTML and Microsoft IE7 http://www.molly.com/2005/12/22/star-html-and-microsoft-ie7/ this comment was broadly accepted: “If IE7 fixes all those issues and behaves according to W3C standards, why should the hack matter?… If IE7 is as good as they say, it should ignore the hack and just render everything normally while IE6 and lower will still use the hack.” So fixing the /**/-bug requires fixing the !important bug. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] masthead image and floated ul fall apart in IE5 for Mac
In the site http://www.nauticawatches.com/ the contents of div#nav fall
apart in IE5 for Mac (see attached image sent by the client). I don't have
a Mac at this location, and I have had trouble downloading IE Mac for 5 at
home, so I was hoping someone with that browser could look at the site and
suggest what is breaking the IE5 for Mac display. The CSS for the nav id is
#nav {
background-color: #fff;
margin: 0;
padding: 0;
}
#nav a img {
margin: 15px;
}
#nav ul {
list-style-type: none;
}
#nav ul li {
float: right;
padding: 0;
margin: 0;
}
#nav ul li a {
display: block;
padding: 0;
margin: 10px 0 0 0;
text-decoration: none;
}
#nav ul li a img{
margin: 10px 10px 0 0;
}
Any help would be appreciated!
---Carl (my first post to the list)
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Safari puzzlement with divs/possibly float issues?
Hi there,
I'm having some issues with how Safari is displaying items on one of my
pages. First, here is the page:
http://www.joelschettler.com/about/
It displays as it should in FF and IE.
Second, here is the section in question:
Recommended Reading (left hand side column, below What I'm Reading)
Third, here are the details:
1. When the titles on those books were shorter (e.g. just Blink for
the top one and The 10 Faces of Innovation for the bottom) , each book
and its titles displays next to the other (left to right, rather than
stacked on top of each other). I made the titles longer (added more
words) and it appears to have helped them stack, but there is still an
issue of:
* - what if he has books with short titles?
- why is there a huge gap between the recommended reading header and
the books below it?*
2. Please note these books are using the same code as the What I'm
Reading Section above it. Here is the page code: (I edited out the
expression engine code being used to generate the books)
div class=sidetitleRecommended Reading/div
div class=sidetext
div class=booktext
div class=bookthumba href=http://urltobook;img
src=http://srctothumb;/a/div
div class=booktitleTitle of book/div
div class=bookauthorAuthor of book/div
/div!-- end book text --
/div
3. Here is the css code for the above classes. I have a hunch it's my
floats that are causing issues in Safari, but I don't know why/how or
what might help (I don't have Safari to troubleshoot, I've been using a
capture program)
.sidetitle {text-transform: capitalize;
}
.sidetext {font-size: 10px;
padding: 5px 0 30px 0;
}
.booktext {float: left;
margin-bottom: 20px;
}
.bookthumb {float: right;
padding-left: 10px;
}
.bookthumb img {padding: 5px;
border: 1px solid #6F675A;
}
.booktitle {font-size: 11px;
color: #6F675A;
font-family: 'Bookman Old Style', Georgia, Times, serif;
font-weight: bold;
}
(.bookauthor has no style definition)
So again, how to troubleshoot for books with shorter titles and how to
solve the gap problem currently seen on the page. If need be, I am
happy to shorten the title of the books to display for people the
issues that caused.
Thank you very much for your help and time. Oh, and yes, I usually use
flexible font sizes but some other issues prevented me from doing so on
this project :)
Reese
[EMAIL PROTECTED]
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.375 / Virus Database: 267.15.0/249 - Release Date: 2/2/2006
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clear: both + negative margin -- should it do anything?
For anyone who's interested, I put up a test page with screenshots There is no test case there, only screen shots. Sorry for the confusing terminology; I didn't mean that the page had a test case. (I'm trying to compare different browser renderings for a project I'm working on, so screenshots all on one page were most useful for my purposes.) I added a live demo to the bottom of the page to make it more useful to others, although of course yours is way, way nicer. When quoting the specs, it is a good idea to refer to the latest one; Oh, sorry again -- I referred to the latest recommendation rather than the latest draft. I'm not sure that the latest draft is really any clearer, though... IE 6 Win is half correct (test 2 and 3), probably more by accident. Yeah, that was my conclusion as well. :) From Ingo's IE7b2 screenshot, it looks like nothing has changed yet. cheers, Lori __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Aligning to bottom of a div
I am trying to align a piece of text to the bottom of a div. On the example site http://www.netrarc.com/btfloat/ you will see an h2 price tag inside each div. How I can make the h2 tag stay on the bottom of the div? -- Thanks, George __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] No scrollbar at all in IE
I have a weird problem which I've never encountered or heard of. I've been
rebuilding a table site into css/xhtml. I use a mac so everything's been
going great with the mac browsers. Then, I check on a pc IE6. A couple of
pages where content is longer than the window there is no scrollbar at all.
I tried the force scrollbar method of html { height: 100% } body {
min-height: 101% }
I also tried adding a height of 1200px into the ie.css stylesheet within the
conditional comment. No luck there either.
I just added these javascript titles to the site and thought maybe they were
the problem but they werent.
The site is rather small so don't need to use floats, therefore I am using
some relative and minimal absolute positioning...never had a problem before
with this though.
page in question:
http://www.lowandtritt.com/new/communicate.html
Any ideas?
Thanks,
David
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problems with IE 7
Actually (as crazy as this sounds), this isn't a CSS error, but an HTML error (but only in this case; spaces on other elements are related to CSS). I already reported it to the IE team yesterday. It's documented here: http://www.howtocreate.co.uk/wrongWithIE/?chapter=Empty+Elements It appears as if IE doesn't process /li and doesn't close a list item until it hits either li or the end of the list item. When you add a line break (like most of us do to make the code look better), IE generates a gap in the li where the line break is in the source. Christian Heilmann wrote: Just added a workaround for the whitespace issue to the wiki, can you please confirm that it works for you, too? http://icant.co.uk/sandbox/whitespaceBugMSIE7.html -- http://www.mozilla.org/products/firefox/ - Get Firefox! http://www.mozilla.org/products/thunderbird/ - Reclaim Your Inbox! Please avoid sending me Word or PowerPoint attachments. See http://www.gnu.org/philosophy/no-word-attachments.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] No scrollbar at all in IE
David Ross wrote: I have a weird problem which I've never encountered or heard of. I've been rebuilding a table site into css/xhtml. I use a mac so everything's been going great with the mac browsers. Then, I check on a pc IE6. A couple of pages where content is longer than the window there is no scrollbar at all. Sounds like the unscrollable content bug: http://www.positioniseverything.net/explorer/unscrollable.html HTH, Nick. -- Nick Fitzsimons http://www.nickfitz.co.uk/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] multi columns layouts in the Zen Garden, floating and positioning
On 2/2/06, Christian Collins wrote: Does anyone know of a Zen Garden layout that floats the linkList div to the left or right of the main content? I've looked through 5 or 6 two-column layouts so far and they all use the position: absolute method. does it have to be zen garden layouts? if not, there are some nice two column layouts listed in the wiki, and i've heard the three column ones can usually be easily turned into two columns. http://css-discuss.incutio.com/?page=CssLayouts __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One True Layout
Rob Cochrane wrote: I am experimenting with Alex's excellent 'one true layout' to dynamically change from what is effectively a Left To Right layout to a Right To Left one. I have set up the style sheets such that the common items are in one and I switch via PHP those that influence the layout. Layouts are 2:1:3 and 3:1:2 All is great in FF but in IE one layout crashes and I have overlooked something or something is causing the error. The problem occurs when one selects Arabic (thus changing the read direction and switching CSS) as the language and submits in IE (6 and 7) the 2nd and 3rd columns pile to the right! Page: http://demo.by-rob.com/BasicTemplate.php CSS: http://demo.by-rob.com/css/basiclayout.css http://demo.by-rob.com/css/layoutRTL.css http://demo.by-rob.com/css/layoutLTR.css If you would be so kind as to show me the error of my ways I am beginning to despair is there no one within this august body that is able to offer some clue, original author included? Perhaps it is the M$ IE7 madness? Perhaps. Or perhaps the rtl problem is just not solved yet, and nobody knows an answer. I do not. Could you please simplify your attempt, e.g. by using an /original/ layout by the generator http://www.fu2k.org/alex/css/onetruelayout/example/interactive and try to add dir=rtl. If you can make this work in IE6, then start adding new items. Otherwise, post this minimal testcase. I did try it in IE7b2, that's what currently installed here, and the trick was to move the dir from body to an inner wrapper of body. Of course, this did not work with your page. Again, simplify. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning to bottom of a div
On 2/3/2006 10:30 AM George Cummins wrote:
I am trying to align a piece of text to the bottom of a div. On the
example site
http://www.netrarc.com/btfloat/
you will see an h2 price tag inside each div. How I can make the h2
tag stay on the bottom of the div?
This is only semi-tested, but I often do similar things:
#plan1 {
border: 1px solid gray;
width: 200px;
height: 300px;
padding: .5em;
float: left;
margin: 10px;
position: relative; /*provides a positioning context*/
}
#planfooter {
position: absolute; /*new rule*/
bottom: 0; /*puts it on the bottom*/
}
You might want to give your price footers a class as well as an id and
then position the class--it'll save some electrons.
--
Steve Clason
Web Design and Development
Boulder, Colorado, USA
www.topdogstrategy.com
(303)818-8590
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] About Conditional Comments IE7b2
For those who are complaining about strange results with Conditional Comments and the IE7 beta... A post was just made on the IE Blog mentioning that the IE7 Beta is looking for this: !--[if IE 7.0b] and not !--[if IE 7.0] I believe that goes a long way to explaining why some sites are reacting funny to certain conditional comment types. I guess that means we're going to have to think about this. I did find that !--[if lte IE 6] is ignored by IE7, but parsed by IE6 and less. Maybe use that in place of !--[if lt IE 7.0] -- http://www.mozilla.org/products/firefox/ - Get Firefox! http://www.mozilla.org/products/thunderbird/ - Reclaim Your Inbox! Please avoid sending me Word or PowerPoint attachments. See http://www.gnu.org/philosophy/no-word-attachments.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] About Conditional Comments IE7b2
From: Kelly Miller [EMAIL PROTECTED] For those who are complaining about strange results with Conditional Comments and the IE7 beta... A post was just made on the IE Blog mentioning that the IE7 Beta is looking for this: !--[if IE 7.0b] and not !--[if IE 7.0] Yes - but !--[if IE 7] works perfectly unless the goal is to target only beta releases, which is good for testing but could cause problems or confusion down the road. -- Al Sparber PVII http://www.projectseven.com Designing with CSS is sometimes like barreling down a crumbling mountain road at 90 miles per hour secure in the knowledge that repairs are scheduled for next Tuesday. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE not showing image, while FF does
From: Stefan Witte [EMAIL PROTECTED] when you click on the image you will be transfered to waaromnades2.php, how can i have the content div in which the picture and the text are auto extend to the height, http://www.motionedmedia.com/projects/vakantiehuisjefrankrijk/waaromnades.php css file: http://www.motionedmedia.com/projects/vakantiehuisjefrankrijk/css/main.css In your HTML, you'll need to add a clearing element following the class=red div and before the close of the container div. br style=clear: both; / I'd recommend moving that inline style to your style sheet. I hope that helps, ~holly Thanks a lot, this did the trick! Greetings, Stefan __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Drop Shadows
Can anyone point me to a good tutorial on how to create drop shadows that tile vertically on either side of a main column? Thanks. -- Jamie Cantrell Creative Director Square 1 Creative ph. 703-738-9656 fax. 703-9974833 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Inline styles and the people who hate them.
I prefer having an [external] css file for each page because 1) VS.Net [for some strange reason] gives me CSS IntelliSense and CSS designer support when css is either in an inline-style tag or in a .css file but *NOT* when the css is put into a style/style tag set in the HEAD of a document. The css IntelliSense support while not complete is nice. 2) I can make changes to the css file without touching the .aspx page 3) the css file is cached client side. I really like the idea of giving the body tag an ID though - that's something I have never thought of. james c -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Ian Anderson snip You should only use external CSS when the rules are for sharing with other pages, IMHO. Otherwise you are adding inconvenience without gaining any corresponding benefit, and it means an extra server hit for each page viewed - completely contrary to all the normal advantages of using external files. Keeping the rules within the document allows you to use sensible global naming conventions within each page like... /snip __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] !important will be fixed in IE7, too
Markus Mielke just answered on IE7blog, !important is fixed in recent builds. updated my obsolete demo. Ingo -- http://www.satzansatz.de/css.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop Shadows
jamie cantrell wrote: Can anyone point me to a good tutorial on how to create drop shadows that tile vertically on either side of a main column? Thanks. If you mean using CSS to create drop shadows, you might look at these demos and see if you can modify same to meet your need? http://www.cssplay.co.uk/menu/shadow2.html http://www.cssplay.co.uk/menu/shadow.html Otherwise, Google for Photoshop or Gimp techniques. Regards, ~davidLaakso __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] positioning image to bottom of div, top of footer
I'm trying to figure out a way to position an image to the bottom of a block so that it lines up with the footer and the image in the footer and yet the text in the same block as the image flows around the top of the image. Here is the page in question: http://www.slsd.org/teacher/washkod/foundation/take2/index.html Now if the text in the main body exceeds the height of the image, this is what happens: http://www.slsd.org/teacher/washkod/foundation/take2/index_ohno.html I've tried a whole bunch of different things, but I cannot get the image to stay on the bottom of the block Thanks in advance for any assistance/advice! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] padding around image in IE6
Hello, I have a class that is supposed to put 10 pixels of padding around an image. It works just fine in Firefox 1.5 Mac/Win, and also in Safari 2, but there is no padding in Internet Explorer IE 6. I am at a loss as to why it isn't functioning... Site: http://www.americanhomedesign.com/home It is the image of a building with two cars in the parking lot... Here is the style sheet: http://www.americanhomedesign.com/stylesheets/default.css Any ideas? Thanks! __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding around image in IE6
jeremy*pinnix wrote: I have a class that is supposed to put 10 pixels of padding around an image. It works just fine in Firefox 1.5 Mac/Win, and also in Safari 2, but there is no padding in Internet Explorer IE 6. http://www.americanhomedesign.com/home Quirks mode rendering in IE6. Solution: Add a proper doctype[1] on top and make that page conform to chosen standard, and IE6 in standard compliant mode will render as you want. Tested your page with html 4.01 Strict - no problem. regards Georg [1]http://www.w3.org/QA/2002/04/valid-dtd-list.html -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding around image in IE6
On 2/3/2006 2:23 PM jeremy*pinnix wrote: I have a class that is supposed to put 10 pixels of padding around an image. It works just fine in Firefox 1.5 Mac/Win, and also in Safari 2, but there is no padding in Internet Explorer IE 6. I am at a loss as to why it isn't functioning... Site: http://www.americanhomedesign.com/home It is the image of a building with two cars in the parking lot... Here is the style sheet: http://www.americanhomedesign.com/stylesheets/default.css Any ideas? Maybe. Your page lacks a DOCTYPE so IE6 (and IE7b, in case anyone is interested) renders in quirks mode with a broken box model. I believe that puts the padding inside the dimensions of the image, and so covered by the image. Put this (or something like it) first in your mark-up: !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd; and things should be hunky-dory, though I confess I didn't test it. -- Steve Clason Web Design and Development Boulder, Colorado, USA www.topdogstrategy.com (303)818-8590 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] padding around image in IE6
Good Friday Afternoon to all jeremy*pinnix wrote: I have a class that is supposed to put 10 pixels of padding around an image. It works just fine in Firefox 1.5 Mac/Win, and also in Safari 2, but there is no padding in Internet Explorer IE 6. http://www.americanhomedesign.com/home George wrote Quirks mode rendering in IE6. Solution: Add a proper doctype[1] on top and make that page conform to chosen standard, and IE6 in standard compliant mode will render as you want. Tested your page with html 4.01 Strict - no problem. regards Georg [1]http://www.w3.org/QA/2002/04/valid-dtd-list.html -- To add to Georg's reply, I also like Zeldman's article at A list Apart [1]; Fixing Your Site With the Right Doctype!. The O Reilly Network [2] has a good article on Using Doctypes and there is valuable information in the CSS-D WIKI [3] located under Switching. Best to you all... [1] http://www.alistapart.com/stories/doctype/ [2] http://www.oreillynet.com/pub/a/network/2000/04/14/doctype/ [3] http://css-discuss.incutio.com/ Jim Nannery www.redfernenterprises.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Flashy CSS Menus
Hey one and all how are we all doing? I have been floating round the wen trying to garner little gems for css menus. I have found some great ones, but was just wondering if anybody could recommend some examples of more graphically impressive ones. For example can button fades by done with css? I am looking for examples of this in particular if it can even be done. Thanks a million in advance. Dave __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Drop Shadows
David Laakso wrote: jamie cantrell wrote: Can anyone point me to a good tutorial on how to create drop shadows that tile vertically on either side of a main column? Thanks. If you mean using CSS to create drop shadows, you might look at these demos and see if you can modify same to meet your need? http://www.cssplay.co.uk/menu/shadow2.html http://www.cssplay.co.uk/menu/shadow.html Otherwise, Google for Photoshop or Gimp techniques. Regards, ~davidLaakso Hi Jamie, And perhaps: a one page mini-tutorial http://home.tiscali.nl/developerscorner/css-discuss/test-dropshadows.htm with some examples and links. francky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE issues
I am just learning how to create pages with heavy use of CSS, so
please bare with me on trying to figure out the differences between
IE's use of CSS and every other browsers. I am trying to have a
center container and all content within that container. I want it to
work much like http://www.news.com.
What I have is this:
.container
{
width: 800px;
background: url(../images/center.gif);
margin: 0 auto;
border: 1px solid red;
}
In Firefox and Safari, everything looks great, but in IE, it looks
like a train wreck. You can see it at http://www.philliparock.com/
beta I have added the red border to show where the container ends.
You will see that in IE it ends earlier than it should.
Can anyone tell me what I need to do to get this to display
correctly? Am I asking too much?
Mike
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Flashy CSS Menus
On 2/3/06, Ionize [EMAIL PROTECTED] wrote: Hey one and all how are we all doing? I have been floating round the wen trying to garner little gems for css menus. I have found some great ones, but was just wondering if anybody could recommend some examples of more graphically impressive ones. For example can button fades by done with css? I am looking for examples of this in particular if it can even be done. I think what you are looking for is best handled by CSS enhanced with Javascript. There's a lot of options, one you can look into is FACE: http://kurafire.net/projects/face -- -- Christian Montoya christianmontoya.com ... rdpdesign.com ... cssliquid.com __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] positioning image to bottom of div, top of footer
Dann, On Feb 3, 2006, at 4:10 PM, Dann S. Washko wrote: I'm trying to figure out a way to position an image to the bottom of a block so that it lines up with the footer and the image in the footer and yet the text in the same block as the image flows around the top of the image. Here is the page in question: http://www.slsd.org/teacher/washkod/foundation/take2/index.html Now if the text in the main body exceeds the height of the image, this is what happens: http://www.slsd.org/teacher/washkod/foundation/take2/index_ohno.html 1: Validate. 2: Remove the image from the html 3: Class or ID the container div around everything between .navbar and .footer 4: Style it with padding-left: 140px; background: #b4c2da url(/images/montage_top.png) bottom left no-repeat; margin-bottom: 0; -- Roger Roelofs Remember, if you’re headed in the wrong direction, God allows U-turns! ~Allison Gappa Bottke __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Safari puzzlement with divs/possibly float issues?
On 4 Feb 2006, at 1:11 am, Reese @ M2 Web Studios wrote:
I'm having some issues with how Safari is displaying items on one
of my
pages. First, here is the page:
http://www.joelschettler.com/about/
It displays as it should in FF and IE.
Second, here is the section in question:
Recommended Reading (left hand side column, below What I'm
Reading)
Third, here are the details:
1. When the titles on those books were shorter (e.g. just Blink for
the top one and The 10 Faces of Innovation for the bottom) , each
book
and its titles displays next to the other (left to right, rather than
stacked on top of each other). I made the titles longer (added more
words) and it appears to have helped them stack, but there is
still an
issue of:
* - what if he has books with short titles?
- why is there a huge gap between the recommended reading header
and
the books below it?*
.booktext {float: left;
margin-bottom: 20px;
}
Give a width to your .booktext. Currently it collapses to the width
of the image when the book title is short.
Philippe
---
Philippe Wittenbergh
http://emps.l-c-n.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
