[css-d] create expandable banner

[Rebecca Richter]

Hi and Happy New Year :)

I am familiar with creating a background image and repeating it with css to 
make a banner, but how do you do it if the banner has a non-uniform 
background, like on this site: http://www.myersonassociates.com/? Do I just 
make an image with wide dimensions, like 5000 px wide, and use positioning 
to give it the expandable appearance? Or do I need 2 images--one to repeat 
left and one to repeat right?

Thanks!

Becca 

__
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/

Re: [css-d] Menu not displaying well in IE 6

[Highpowered]

Lisa Wilcox wrote:
> I have a web site www.familyfirstdocs.com. In IE6 with WinXP, the scrolling
> seems to be disabled on the dropdown menus. In IE 7 and on Firefox it
> seems fine. When I use dreamweaver cs3 it gives me a list whitespace
> bug. I try to apply the fixes it suggests, but I still have the same
> issue. Below is my menu css.
>
> #menuh ul ul
> {
> position:absolute;
> z-index:500;
> top:auto;
>
> display:none;
> padding: 1em;
> margin:-1em 0 0 -1em;
> width: 175px;
>
> text-align: left;
> }
>
> Anyone have any ideas?
>
> Thanks 
> Lisa
>   
Change the declaration to #menuh ul li ul to enable proper targeting in 
the document structure.

Happy New Year!

-HP
__
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/

Re: [css-d] A confusing twist on the 3-column layout

[Gunlaug Sørtun]

Matt Feldman (inthedistance.net) wrote:

> http://www.mincel.com/gallery/travel_places/paris/IMG_1610.JPG.html
> 
> What I'm trying to do is replicate the display of this photo. Ignore 
> everything but the main photo and the navigation bar icons directly 
> above and below. I only want to use a lower navigation bar, so this 
> becomes like a 3 column layout with header, where the header contains
> the photo and the 3 columns contain those nav buttons.

I'm not sure if IE/win will cooperate so easily when this becomes part
of a larger layout, but the following does work on its own...



regards
Georg
-- 
http://www.gunlaug.no
__
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] Menu not displaying well in IE 6

[Lisa Wilcox]

I have a web site www.familyfirstdocs.com. In IE6 with WinXP, the scrolling
seems to be disabled on the dropdown menus. In IE 7 and on Firefox it
seems fine. When I use dreamweaver cs3 it gives me a list whitespace
bug. I try to apply the fixes it suggests, but I still have the same
issue. Below is my menu css.

#menuh

{font-size: small;
font-family: arial, helvetica, sans-serif;

width:100%;
height: 28px;
}

#menuh a
{
text-align:
center;
display:block;
border: 1px solid #33;

white-space:nowrap;
margin:0;
}

#menuh a, #menuh a:visited
/* menu at rest */
{
color: white;
background-color: #4572B6;

text-decoration:none;
}

#menuh a:hover/* menu at mouse-over
*/
{
color: #00;
background-color: #A1B1A4;
}

#menuh ul
{
list-style:none;
margin:0;
padding:0;

float:left;
width:100px;/* width of all menu boxes */
}

#menuh
li
{
position:relative;
min-height: 1px; /* Sophie Dennis
contribution for IE7 */
vertical-align: bottom; /* Sophie Dennis
contribution for IE7 */
}

#menuh ul li 
{
height: 1%;

}

#menuh ul ul
{
position:absolute;
z-index:500;
top:auto;

display:none;
padding: 1em;
margin:-1em 0 0 -1em;
width: 175px;

text-align: left;
}

#menuh ul ul ul
{
top:0;
left:100%;

}

div#menuh li:hover
{
cursor:pointer;
z-index:100;

}

div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li
li:hover ul ul,
div#menuh li li li li:hover ul ul
{display:none;}

div#menuh
li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover
ul,
div#menuh li li li li:hover ul
{display:block;}

/* End CSS Drop Down
Menu */


Anyone have any ideas?

Thanks 
Lisa




__
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/

Re: [css-d] A confusing twist on the 3-column layout

[Jim Davis]

Matt,

I have done a demo of how I would solve the problem.
http://www.jimdavis.org/variwidth.php

The idea is to create a div that is the width of the photo. The div will
also contain a holder for the icons.

If you don't want to change each page by hand you can write a php script
that will get the width of the image for you.

Jim

On Dec 30, 2007 7:54 PM, Matt Feldman (inthedistance.net) <
[EMAIL PROTECTED]> wrote:

> ...Here's an example:
>
> http://www.mincel.com/gallery/travel_places/paris/IMG_1610.JPG.html
>
> What I'm trying to do is replicate the display of this photo. Ignore
> everything but the main photo and the navigation bar icons directly
> above and below. I only want to use a lower navigation bar, so this
> becomes like a 3 column layout with header, where the header contains
> the photo and the 3 columns contain those nav 
> buttons
>
__
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/

Re: [css-d] (no subject)

[Brian Simmons]

Thanks this fixed the problem.

Brian Simmons
[EMAIL PROTECTED]
www.simmonswebdesign.net
404.316.2655


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Shawn Lawler
Sent: Monday, December 31, 2007 11:31 AM
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] (no subject)

Brian Simmons wrote:
> I am having trouble with my links on the page. I have a top menu and a
side
> menu. When you click on any link the whole system breaks down
Yes indeed the clicks are trashing your layout, specifically a:visited 
is doing you in ;)
In your stylesheet when you're declaring your link rules you 
consistently drop part of the specificity for the :visited pseudo class...

#menu a:link, a:visited {  <--- you'd want that second part to read 
#menu a:visited
color: #ff;
text-decoration: none;
text-align: right;
}

This mistake is repeated several times down the page, meaning that 
cumulatively you're applying a lot of styles to ALL your :visited links.

SCL
__
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-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/

Re: [css-d] (no subject)

[Andrew Frazier]

On Mon, 31 Dec 2007 14:38:46 -, Brian Simmons  
<[EMAIL PROTECTED]> wrote:

> I am having trouble with my links on the page. I have a top menu and a  
> side
> menu. When you click on any link the whole system breaks down. A link is
> provided in order to view the problem. Any help would be greatly
> appreciated.
> http://208.106.151.24/turner/

Try changing these:
#menu a:link, a:visited
#leftContent a:link, a:visited
#RightMenu a:link, a:visited
#extraSideBar a:link, a:visited

to these:
#menu a:link, #menu a:visited
#leftContent a:link, #leftContent a:visited
#RightMenu a:link, #RightMenu a:visited
#extraSideBar a:link, #extraSideBar a:visited


-- 
Andrew Frazier
http://www.kidderminsterharriers.com

ICQ: 77914158

Using Opera's revolutionary e-mail client: http://www.opera.com/m2/

__
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] Floating content contained in Header

[trystano]

Hi all,

I have a header section of my website which will have the logo on the left side 
and then on the right side will be some text and other bits and bobs. To? 
accomplish this I have done a float left on the  
containing the image on the left and then a float: right on the  to the right that will contain some text. I have set 
widths to both of these so that they meet up correctly. Is this the best way to 
accomplish this? I feel that this approach can easily be broken because if div 
to the right expands it breaks the layout (i guess this is standard CSS).

The HTML markup and CSS is as follows...

*
HTML
*


??? 
??? ??? 
??? 
??? 
??? ??? 
??? ??? ??? language select:
??? ??? ??? 
??? ??? ??? 
??? ??? 
??? 
??? 



*
CSS
*
#header 
{
??? background:#ddd;
}

#headercontent1
{
??? float: left;
??? width: 200px;
??? background-color: #FFF;
}

#headercontent2
{
??? float: right;
??? width: 536px;
??? height: 90px;
??? padding: 5px;
??? text-align: center;
}

.clear
{
??? clear: both;
}

Thanks and a happy new year to you all.

Tryst


AOL's new homepage has launched. Take a tour at http://info.aol.co.uk/homepage/ 
now.
__
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/

Re: [css-d] box bottom not where I expect it to be

[Kenneth Stephen]

Hi,

Amazingly enough, the page renders as expected in IE6. I'm not
getting the right rendering in Firefox 2.

Regards,
Kenneth
__
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] box bottom not where I expect it to be

[Kenneth Stephen]

Hi,

Here is my test case:

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">



.report {
margin: 0em;
padding: 0em;
border-collapse: collapse;
}

.milestone-section {
margin: 0em;
padding: 0em;
border-collapse: collapse;
border-bottom: thin solid yellow;
}

.line-item {
margin: 0em;
padding: 0em;
border-collapse: collapse;
}

.milestone-row {
clear: left;
}

.milestone-name-row {
clear: left;
}

.line-item-entry {
clear: left;
}

.por-phase-row {
clear: left;
}

.li-desc-row {
clear: left;
}

.milestone {
float: left;
width: em;
}

.milestone-name {
float: left;
width: 9em;
padding-top: 1em;
}

.por-phase-desc {
float: left;
width: em;
}

.por-phase {
float: left;
width: 24em;
}

.li-desc {
float: left;
width: 24em;
}

.li-start {
float: left;
width: 8em;
}

.li-end {
float: left;
width: 8em;
}

.milestone-name {
float: left;
width: 8em;
}

.line-item-entry {
position: relative;
padding-top: 0.5em;
left: 8em;
width: 40em;
border-top: thin solid black;
}

.feature-details {
clear: left;
position: relative;
left: 10em;
width: 40em;
border-bottom: thin solid blue;
}

.por-phase {
float: left;
width: 24em;
}

.li-desc {
float: left;
width: 24em;
}

.li-start {
float: left;
width: 8em;
}

.li-end {
float: left;
width: 8em;
}

.feature-id {
float: left;
width: 5em;
}

.feature-abstract {
float: left;
width: 25em;
border-bottom: thin solid red;
}



http://www.w3.org/1999/XSL/Format";
class="report">




FRS





28E K01


Uncapped utilization of unused dedicated
capacity



2007-12-01
2008-02-01


557984

Re: [css-d] (no subject)

[Shawn Lawler]

Brian Simmons wrote:
> I am having trouble with my links on the page. I have a top menu and a side
> menu. When you click on any link the whole system breaks down
Yes indeed the clicks are trashing your layout, specifically a:visited 
is doing you in ;)
In your stylesheet when you're declaring your link rules you 
consistently drop part of the specificity for the :visited pseudo class...

#menu a:link, a:visited {  <--- you'd want that second part to read 
#menu a:visited
color: #ff;
text-decoration: none;
text-align: right;
}

This mistake is repeated several times down the page, meaning that 
cumulatively you're applying a lot of styles to ALL your :visited links.

SCL
__
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] (no subject)

[Brian Simmons]

I am having trouble with my links on the page. I have a top menu and a side
menu. When you click on any link the whole system breaks down. A link is
provided in order to view the problem. Any help would be greatly
appreciated.
 
http://208.106.151.24/turner/
 
Thanks,
 
Brian Simmons
 
 
Brian Simmons
[EMAIL PROTECTED]
www.simmonswebdesign.net
404.316.2655
 
__
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] A confusing twist on the 3-column layout

[Matt Feldman (inthedistance.net)]

Hi all,

I'm new to the list and relatively new to the world of web design in 
general, having been using Joomla! for a year or so to tinker with 
putting my website online. I'm also using Gallery2 for photo 
presentation, and that brings me to my issue.

The templates that are out there for G2 are all well and good, but built 
on tables with terrible technique and usually non-existent commenting, 
all wrapped in CSS that is just a mess. Trying to deconvolute this stuff 
can be like reading hieroglyphics. So I've found a template I like but 
want to make changes to it that have me pining for a tableless design. 
Really, I just want to strip it down. For now, my concern is only with 
the photo display page. Here's an example:

http://www.mincel.com/gallery/travel_places/paris/IMG_1610.JPG.html

What I'm trying to do is replicate the display of this photo. Ignore 
everything but the main photo and the navigation bar icons directly 
above and below. I only want to use a lower navigation bar, so this 
becomes like a 3 column layout with header, where the header contains 
the photo and the 3 columns contain those nav buttons.

But with this table design, widths aren't specified, so however large 
the photo (header) is, the nav buttons below will always be left, center 
and right justified, respectively,  to the image edge. And the container 
that holds the header/column combo is centered on the page (ignoring the 
thumbnail panel).

It seems that this should be simple to do without tables, but I've made 
many stabs at it and failed. I'm not sure what I'm missing. Can anybody 
lend some insight into this?

Many thanks in advance. Hope everyone is having a happy holiday.

Matt
__
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] Troublesome site

[Lisa Wilcox]

I'm still having trouble with this site www.familyfirstdocs.com

I can't seem to scroll through the drop down menus in IE6. The menus show up
but when I try to scroll, they disappear.

I can really use some advice on this.
Thanks
Lisa



__
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/