I am an application developer learning web design and css. I am new
to blueprint, and am having difficulties getting nested <divs> to work
how I would like. I would like the content in the section tag to
"appear inside" the white box, with rounded corners (defined by my
section attributes). However the content is not expanding the section
box. The section box is only about 20px horizontally, while my
content goes down much further on the page. The content seems to
appear as a layer on top of the section box, not "appearing in it".
I have included my HTML and custom CSS below.
Thank you
CSS:
.container {
width: 830px;
}
section {
width: 790p;
padding: 20px;
margin-top: 10px;
font-size: 120%;
background: #fff;
}
.round {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
HTML:
<body>
<div class="container">
<header>
<a href="/"><img alt="Sample App"
class="round" src="/images/logo.png?1302753577" /></a>
<nav class="round">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/howitworks">How It
Works</a></li>
<li><a href="/studios/1">Profile
(S)</a></li>
<li><a href="/studios/1/
edit">Settings</a></li>
<li><a href="/signout" data-
method="delete" rel="nofollow">Sign out</a></li>
</ul>
</nav>
</header>
<section id="content" class="round">
<div id="profile_header" class="span-20 last">
<div class="span-12"><h1>Profile Name</
h1></div>
<div sclass="span-8 last"><h1>My
Navbar</h1></div>
</div>
<div id="profile_main" class="span-20
last">
<div id="profile_details"
class="span-12">
Profile Name<br/>
Profile Email<br/>
Profile Address<br/>
</div>
<div id="profile_image" class="span-8
last">
Image goes here
</div>
</div>
</section>
<footer>
<nav class="round">
<ul>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
</footer>
</div>
</body>
--
You received this message because you are subscribed to the Google Groups
"Blueprint CSS" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/blueprintcss?hl=en.
