Placing a fairly transparent background behind text

avman

I am in need of a solution for my "new" webpage(s) and hope anyone can help. My web page - avman.smugmug.com . I have created header text that is white with my contact info which is displayed on every page of my site. I have also created a menu bar with spaced buttons. Finally, I have created light colored text gallery names in each of my galleries. I have recently change the format of each gallery to display a random photo from that gallery as a background. My problem occurs when the background changes from dark to light. My contact info disappears into the light background. Can an almost transparent custom sized background be placed behind the light colored text so the text doesn't disappear into a light colored background? Can the menu button spacing be decreased? Can an almost transparent custom sized background be placed behind the light colored text so the text doesn't disappear into a light colored background in my galleries? Any help will be greatly apprieciated. I will live with my site as it is if I have to, but I am thinking coding exists to accomplish what I am attempting, I just don't know or have access to it just yet. Thank you in advance for any assistance you may be able to provide!
Respectfully,
Tom

Allen

avman wrote: »

I am in need of a solution for my "new" webpage(s) and hope anyone can help. My web page - avman.smugmug.com . I have created header text that is white with my contact info which is displayed on every page of my site. I have also created a menu bar with spaced buttons. Finally, I have created light colored text gallery names in each of my galleries. I have recently change the format of each gallery to display a random photo from that gallery as a background. My problem occurs when the background changes from dark to light. My contact info disappears into the light background. Can an almost transparent custom sized background be placed behind the light colored text so the text doesn't disappear into a light colored background? Can the menu button spacing be decreased? Can an almost transparent custom sized background be placed behind the light colored text so the text doesn't disappear into a light colored background in my galleries? Any help will be greatly apprieciated. I will live with my site as it is if I have to, but I am thinking coding exists to accomplish what I am attempting, I just don't know or have access to it just yet. Thank you in advance for any assistance you may be able to provide!
Respectfully,
Tom

Best I can tell the text widget keeps the same class name on all pages.
See if adding this to your "entire site" CSS gets what you want. The width
was added because without it the color was page wide.

.sm-page-widget-2237542 {
  background:rgba(22, 22, 22, .40);
  width: 330px; 
}

avman

Allen wrote: »

Best I can tell the text widget keeps the same class name on all pages.
See if adding this to your "entire site" CSS gets what you want. The width
was added because without it the color was page wide.

.sm-page-widget-2237542 {
  background:rgba(22, 22, 22, .40);
  width: 330px; 
}

Thank you Al! That is exactly what I am looking for. How can I apply it to the title block? Is the CSS the same for in Gallery descriptions?

Allen

avman wrote: »

Thank you Al! That is exactly what I am looking for. How can I apply it to the title block? Is the CSS the same for in Gallery descriptions?

Ha, I tried to find that green color.

Got a link to a Gallery description?

avman

Allen wrote: »

Ha, I tried to find that green color.

Got a link to a Gallery description?

Green rgb (51,102,0) or #336600

How about http://www.tomdphotos.com/Galleries/GrndTransportation/Trains/i-WnW4zvT . I am attempting to create a semi transparent background behind the word "Trains" above the slideshow button. Thank you for all your help....Respectfully,
Tom

I do have an HTML class book from a course I attended a couple of years ago....I may go back to that and work that out....

Allen

avman wrote: »

Green rgb (51,102,0) or #336600

How about http://www.tomdphotos.com/Galleries/GrndTransportation/Trains/i-WnW4zvT . I am attempting to create a semi transparent background behind the word "Trains" above the slideshow button. Thank you for all your help....Respectfully,
Tom

I do have an HTML class book from a course I attended a couple of years ago....I may go back to that and work that out....

This is going to be difficult site wide because of different gallery styles and placement and length of text.
This will add the background across the page the width of the default box.

.sm-gallery-description {
  background:rgba(51, 102, 0, .40);
  padding-right: 10px;
}

Fine tuning this narrows the description box width and moves it to the right. But it's only for this
length of text. Maybe applied to a "Just this gallery".

.sm-gallery-description {
  background:rgba(51, 102, 0, .40);
  width: 80px; 
  padding-right: 10px;
  margin: 0 auto !important;
}