[css-d] Image within DIV alignment problem
Hi Folks, I've got a frustrating problem center-aligning images within a DIV, which can be seen here: http://niven.gotodon.net/slideshow7.html Though this does display correctly on some Windows browsers, it breaks in Firefox (Mac) and Safari (Mac). Here's a screen capture of what we're seeing: http://www.douglasniven.com/fineprint_draft.html Any ideas or suggestions? I'm spent. Many thanks in advance. Doug __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Bullet placement in unordered lists: IE alignment problem
Hi Folks, I am using unordered lists styled with CSS and have discovered how IE aligns our bullets differently than all the other browsers: http://www.montanamasterchefs.com/schedule.php Using IE the gold bullets above are "top" aligned while in other browsers they are "bottom" aligned. Any suggestions or workarounds how to make this the same for IE as well? Ideally I'd like it "middle" aligned. Thanks in advance for your replies. Best, Doug Santa Cruz, CA __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] CSS borders
Hi Folks, I hate to ask such a seemingly simple question but I've spent a few hours trying to make this work and have run out of ideas. I'm trying to create table borders inside and out 1px thick, like the following: http://stinkyrat.com/css_borders.html The above is a graphic done in Photoshop, but I'd like to recreate this in CSS. If anyone could help, I'd be much obliged. Thanks in advance, Doug Santa Cruz, CA __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Horizontal alignment for Meyer photo gallery/ Win IE irregularity
Hi Folks, Have a look at the following link: http://www.tuolsleng.com/photographs.php I'm happy with how this page displays except that on Windows IE 6 often the divs are not aligned horizontally--one will be down 20 pixels or so. Here's a screen grab of the effect I'm talking about: http://www.tuolsleng.com/grab.jpg Any ideas? I'd love to use CSS instead of tables if possible, but let's be realistic, the majority out there use Windows IE 6. Best, Doug D o u g l a sN i v e n photo researcher/editor http://www.anothervietnam.com Another Vietnam: Pictures of the War from the Other Side * from National Geographic Books * Vietnam's Unseen War: Pictures from the Other Side (DVD) * from National Geographic TV* http://www.tuolsleng.com/ Killing Fields from Twin Palms Press Secrets of S-21 from the BBC __ 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] Pseudo class links
Hi Folks, I admit I'm no CSS wizard but I'm very perplexed why some very basic CSS to style my links is not working: http://www.douglasniven.com/books.php I have the following embedded directly onto the page above: Yet no colored links! Very confused. Any help would be much appreciated! Best, Doug Santa Cruz, CA __ 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] Pseudo-classes to style links | HELP please!!!
Hi Folks,
I am using the following styles to style links on a page:
a:link, a:visited { text-decoration: underline;
color:#937840; }
a:hover { color: orange; text-decoration: none }
However, at the bottom of my document in a footer I need to style the links
differently and am completely flummoxed how I can do this!
How, for example, could I use an inline style to do this?
Many many thanks for any help!
Best, Doug
Santa Cruz, CA
__
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] Eric Meyer thumbnail gallery
Hello folks,
There is a very nice thumbnail gallery in the More Eric Meyer on CSS book,
which I have temporarily posted here for easy reference:
http://stinkyrat.com/proj02/ch0207.html
My question: Is there any way to align the thumbnails along one baseline? I
think it's a great layout aside from the horizontal alignment, and I know of
no solution to fix thisurgh!
This is the relevant CSS:
div.pic {float: left; height: 130px; width: 130px;
padding: 15px; margin: 5px 3px;}
div.pic img {border: 1px solid; border-color: #444 #AAA #AAA #444;}
div.ls img {height: 96px; width: 128px; margin: 16px 0;}
div.pt img {height: 128px; width: 96px; margin: 0 16px;}
div.pic ul {display: none;}
Any help would be much appreciated!
D o u g l a sN i v e n
photo researcher/editor
http://www.anothervietnam.com
Another Vietnam: Pictures of the War from the Other Side
* from National Geographic Books *
Vietnam's Unseen War: Pictures from the Other Side (DVD)
*from National Geographic TV*
__
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/
[css-d] IMG with inline PADDING not working in IE8
Hi Folks, I'm no CSS expert and sometimes I need to "nudge" a photograph one direction or another a few pixels, and add inline CSS to do so, such as: However, I've noticed this additional padding is not displayed in Internet Explorer (I have IE 8). The padding shows fine in Firefox, Safari and other browsers. I can add a live URL example if needed but thought I'd ask first. Many thanks in advance, Doug __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Fixed three-column with padding: newbie question
Hi Folks, I'm definitely a newbie, trying to wean myself off tables. What I need is a 720px wide box with three 240px cells inside it, with 10px padding-right for each cell. It cannot be "flexible" or stretchable. I found what I **thought** might be the recipe for such a design: http://www.electrictoolbox.com/basic-3-column-fixed-width-css-layout/ However, I cannot get the middle cell to display 240px wide: http://people.ucsc.edu/~class1/ Any suggestions/ideas MUCH appreciated, so I can leave tables behind! Thanks! Cheers, Doug __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Solved: Fixed three-column with padding: newbie question
Hi Folks, Thanks to Thierry and Georg, this now makes sense. Thanks for the help. Doug +++ Hi Doug, > I'm definitely a newbie, trying to wean myself off tables. > What I need is a 720px wide box with three 240px cells inside it, with 10px padding-right for each cell. > It cannot be "flexible" or stretchable. > I found what I **thought** might be the recipe for such a design: > http://www.electrictoolbox.com/basic-3-column-fixed-width-css-layout/ > However, I cannot get the middle cell to display 240px wide: > http://people.ucsc.edu/~class1/ > Any suggestions/ideas MUCH appreciated, so I can leave tables behind! If you set a 240px width and 10px padding, the box is actually 250px wide (because padding/border/width add up). So try 230px instead, and then Google: "CSS Box Model" -- Regards, Thierry | www.tjkdesign.com Subtract the side-padding from the float-width - both side-floats. width: 230px + padding-right: 10px equals float-width = 240px. That will leave 240px between the floats. regards Georg Hi Folks, I'm definitely a newbie, trying to wean myself off tables. What I need is a 720px wide box with three 240px cells inside it, with 10px padding-right for each cell. It cannot be "flexible" or stretchable. I found what I **thought** might be the recipe for such a design: http://www.electrictoolbox.com/basic-3-column-fixed-width-css-layout/ However, I cannot get the middle cell to display 240px wide: http://people.ucsc.edu/~class1/ Any suggestions/ideas MUCH appreciated, so I can leave tables behind! Thanks! Cheers, Doug __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Bulleted list question
Hi Folks, I'm working on the following page: http://dev.franslanting.com/index.php?module=company&pId=100&start=0 The bulleted list under "Pricing" is where I'm having trouble. I'd like the bullets to be in the flush left position they are in now, but I'd like the text --when it goes to a second line--to be indented, instead of going flush left. This is a graphic that illustrates what I'm after: http://www.franslanting.com/drafts/bulleted-list.jpg I'm definitely not a CSS expert so please excuse my newbie question. Thanks in advance for any help/suggestions. Best, Doug __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Bulleted list question
Thierry,
Thanks! Perfect solution, though I needed to adjust the margin.
Doug
This is tricky because the list is next to a float.
So try this:
On the UL: {overflow:hidden;zoom:1;}
On the LIs: {list-style-position:outside;margin-left:15px;}
Note that you should avoid styling things via the "style" attribute (bad
practice).
Add an ID or a class on the list and style via a style block in the
or in an external styles sheet.
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
Hi Folks,
I'm working on the following page:
http://dev.franslanting.com/index.php?module=company&pId=100&start=0
The bulleted list under "Pricing" is where I'm having trouble.
I'd like the bullets to be in the flush left position they are in now, but I'd
like the text --when it goes to a second line--to be indented, instead of going
flush left.
This is a graphic that illustrates what I'm after:
http://www.franslanting.com/drafts/bulleted-list.jpg
I'm definitely not a CSS expert so please excuse my newbie question.
Thanks in advance for any help/suggestions.
Best, Doug
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Couple of newbie CSS questions....
Hi Folks, As mentioned in the subject line, these are newbie questions, in reference to the following: http://www.douglasniven.com/test.html Question One: there is a tiny gap (perhaps only two pixels tall) at the top of the row (highlighted in red at link above). What is the best/preferred way to force both text and images in the same row to align vertically to the same line? I see no "browser" styles using Firebug, but maybe I'm missing something. http://www.douglasniven.com/images/grab.png Question Two: what is the best/preferred way to 1) space the rows using CSS and not cellspacing, and 2) force text say 20 pixels right of the image? The ideal is to make the content display as shown in this screen grab. http://www.douglasniven.com/images/grab2.png I've tried various methods for Question Two but am curious on the expert, "best practices" approach you folks may use. Thanks in advance, and I appreciate your patience with such pedestrian questions. Best, Doug __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
