Jangha
0 views
Skip to first unread message
Jangha
Nov 18, 2009, 3:02:23 PM11/18/09
to Blueprint CSS
Hi guys,
first of all sorry for my english.
I'm using blueprint css for my website that is called Jangha.
Blueprint is awesome !!
I have a problem:
I'm using Blueprint with the standard settings.
and I would like to have a class="span-24" division,
with a yellow background that will cover 100% of the width of the
entire browser page.
Of course if you set the background-color:yellow of this div it will
cover just 950 px.
I manage that putting a background-image to the body and adding some
positioning, but even if it's working, it's not so elegant, and in
some browser it does not look the same.
Do you have any other solution?
Thank you
first of all sorry for my english.
I'm using blueprint css for my website that is called Jangha.
Blueprint is awesome !!
I have a problem:
I'm using Blueprint with the standard settings.
and I would like to have a class="span-24" division,
with a yellow background that will cover 100% of the width of the
entire browser page.
Of course if you set the background-color:yellow of this div it will
cover just 950 px.
I manage that putting a background-image to the body and adding some
positioning, but even if it's working, it's not so elegant, and in
some browser it does not look the same.
Do you have any other solution?
Thank you
Phillip Senn
Nov 18, 2009, 5:51:39 PM11/18/09
to bluepr...@googlegroups.com
Jangha,
body {
background-color:yellow;
}
Be careful because sometimes the browser will not show the results of
a change to css file unless you press shift-refresh,
so your change may be working, but the browser has the old css file cached.
> --
>
> You received this message because you are subscribed to the Google Groups "Blueprint CSS" group.
> To post to this group, send email to bluepr...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/blueprintcss?hl=en.
>
>
>
body {
background-color:yellow;
}
Be careful because sometimes the browser will not show the results of
a change to css file unless you press shift-refresh,
so your change may be working, but the browser has the old css file cached.
>
> You received this message because you are subscribed to the Google Groups "Blueprint CSS" group.
> To post to this group, send email to bluepr...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/blueprintcss?hl=en.
>
>
>
Jangha
Nov 18, 2009, 7:34:04 PM11/18/09
to Blueprint CSS
Hi philip,
Thank you for your answer,
but my main background is white.
You can see a preview of what I want to do at http://www.jangha.com.
Anyway thank you!!
Thank you for your answer,
but my main background is white.
You can see a preview of what I want to do at http://www.jangha.com.
Anyway thank you!!
Christian Montoya
Nov 18, 2009, 9:09:41 PM11/18/09
to bluepr...@googlegroups.com
On Wed, Nov 18, 2009 at 3:02 PM, Jangha <in...@jangha.com> wrote:
> Hi guys,
> first of all sorry for my english.
> I'm using blueprint css for my website that is called Jangha.
> Blueprint is awesome !!
> I have a problem:
> I'm using Blueprint with the standard settings.
> and I would like to have a class="span-24" division,
> with a yellow background that will cover 100% of the width of the
> entire browser page.
> Of course if you set the background-color:yellow of this div it will
> cover just 950 px.
<div id="bgwrapper">
> first of all sorry for my english.
> I'm using blueprint css for my website that is called Jangha.
> Blueprint is awesome !!
> I have a problem:
> I'm using Blueprint with the standard settings.
> and I would like to have a class="span-24" division,
> with a yellow background that will cover 100% of the width of the
> entire browser page.
> Of course if you set the background-color:yellow of this div it will
> cover just 950 px.
<div class="container">
<div class="span-24"
...
</div>
</div>
</div>
<style type='text/css'>
#bgwrapper {
background-color:yellow;
}
</style>
--
--
Christian Montoya
mappdev.com :: christianmontoya.net
Phillip Senn
Nov 18, 2009, 10:13:29 PM11/18/09
to bluepr...@googlegroups.com
Hey Christian!
I didn't know you were on this list!
Did you get a chance to look at
http://groups.google.com/group/blueprintcss/msg/bef7dfff462cdd51
?
>
>
>
I didn't know you were on this list!
Did you get a chance to look at
http://groups.google.com/group/blueprintcss/msg/bef7dfff462cdd51
?
> --
>
> You received this message because you are subscribed to the Google Groups "Blueprint CSS" group.
> To post to this group, send email to bluepr...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/blueprintcss?hl=.
>
> You received this message because you are subscribed to the Google Groups "Blueprint CSS" group.
> To post to this group, send email to bluepr...@googlegroups.com.
>
>
>
Jangha
Nov 19, 2009, 7:18:50 AM11/19/09
to Blueprint CSS
HI Christian my goal is to do something like this:
<body style="background-color:white">
</div>
</div>
<div class="span-24" style="background-color:yellow;width:
100%;height:100px;margin:0 auto">
<!-- this div should be oustide the container to have all the
browser width I would like to put margin:0 auto to center this div but
DOES'T WORK-->
<div class="span-9"><p>bla</p></div>
<div class="span-15 last"><p>bla</p></div>
</div>
<div class="conatiner">
bla bla
</div>
</body>
<body style="background-color:white">
<div class="container">
<div class="span-24">
<p>blabla.....</p>
<div class="span-24">
</div>
</div>
<div class="span-24" style="background-color:yellow;width:
100%;height:100px;margin:0 auto">
<!-- this div should be oustide the container to have all the
browser width I would like to put margin:0 auto to center this div but
DOES'T WORK-->
<div class="span-9"><p>bla</p></div>
<div class="span-15 last"><p>bla</p></div>
</div>
<div class="conatiner">
bla bla
</div>
</body>
Sean K. Stewart
Nov 19, 2009, 9:02:14 AM11/19/09
to Blueprint CSS
Hi Janga,
In order to get the background color to expand the width of browser,
simply remove the class="span-24" on the div with the background
color. So in your example, you can also remove 'width:100%' and
'margin:0 auto'.
If you woud like content within the div that expands the width of
browser, then add an internal div with 'class=container'.
Does this work for your needs?
In order to get the background color to expand the width of browser,
simply remove the class="span-24" on the div with the background
color. So in your example, you can also remove 'width:100%' and
'margin:0 auto'.
If you woud like content within the div that expands the width of
browser, then add an internal div with 'class=container'.
Does this work for your needs?
Goulven CHAMPENOIS
Nov 19, 2009, 9:58:12 AM11/19/09
to bluepr...@googlegroups.com
This is a "fat header", so the fat footer technique should work just as well : place three div.container one after the other.
Example:
<div class="container" id="logo">
<img src="logo.png" alt="Jangha music + people" />
</div>
<div class="container" id="header">
Jangha Development & Deadlines
Jangha Development & Deadlines
</div>
<div class="container" id="page">
[... page content goes here...]
</div>
--
Goulven Champenois
Goulven Champenois
Reply all
Reply to author
Forward
0 new messages