Help - Search - Members - Calendar
Full Version: Huge space and header background problems
HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)
Cathrine
Hi there, first time here! I'm sure I'll be back though!

So, here's the site, http://arbolismo.com/site/index-3.html

On this, and all the other pages, the border around the main content is HUGE. I need it much smaller. I'm using dreamweaver, and not sure if I messed up something while editing something else.

The second issue is the background images for the class levels. There are 5 levels, and they're color coded. I've got the different images for each, "title-1.gif" (1-5, for each class), but when I go to change shark and barracuda (4 & 5), they change the two above them.

Thanks for any help!

~Cathrine
Barthal
body {
font-family:Arial, Helvetica, sans-serif;
font-size:100%;
color:#6d79b5;
min-width:2000px;
background:#171c30;
}
Frederiek
For the first issue, simply get rid of the min-width: 2000px; that you set on body.

As for the second issue, the h3's share the same classes: #page4 .col-1 .title and .title. The first has precedence over the second and thus gets applied. Create different classes for each h3 level.
Cathrine
Wow, feeling really silly with the 2kpx <.<;; Thank you both!

ok, changed the class names, and worked for the 4th (shark), but when I changed the 5th (barracuda), it now used the same graphic as the 4th. So, I changed that bg and now they're the same, but with the new bg. Did I do it wrong?
Darin McGrew
I'm confused. I don't see anything in the CSS that uses the class names "shark" or "barracuda". Meanwhile, the online tools report markup and CSS errors:
http://validator.w3.org/check?uri=http%3A%...ine&group=0
http://jigsaw.w3.org/css-validator/validat...ng=&lang=en
Cathrine
Maybe I didn't have it published... I've saved and "put" again.

I changed the html to:
<h3 class="barracuda"><span class="padding">Barracuda</span></h3>
<h3 class="shark">Shark</h3>

I didn't see a place to change the names in the CSS window. Once I changed the class names, I was able to change one of the back grounds, but now they copy each other, as opposed to copying columns.
Darin McGrew
CODE
        <article class="col-2">
          <div class="row-1 wrapper">
            <article class="maxheight col-1">
The outer article.col-2 has one background, but the inner article.col-1 has a different one, and that's the one that is visible.
Cathrine
Yes, so how do I change that? The coding is just like the row above it, but yet they all have different backgrounds.
Darin McGrew
QUOTE(Cathrine @ Feb 9 2011, 01:44 PM) *
Yes, so how do I change that? The coding is just like the row above it, but yet they all have different backgrounds.
No, it isn't. The first row uses <h3 class="title"> which matches the rule:
CODE
#page4 .col-1 .title {
background : #3a3a77 url(../images/title-5.gif) no-repeat 0% 0%;
}
Since title-5.gif isn't a valid GIF image (it appears to be an Adobe Photoshop Image), the color #3a3a77 is displayed instead.

The second row uses <h3 class="shark"> and <h3 class="barracuda">, which match the rule:
CODE
h3 {
[...]
background : #3a3a77 url(../images/title-2.gif) no-repeat 0% 0%;
}
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2013 Invision Power Services, Inc.