making one area left-aligned while whole page is centered.

Permalink
Hi! I'm making a website in which all areas are in the center of the page, so the pages are centered. But I just want one area to spread across the whole width of the page from left to right. I can't seem to find the right css code to override the centering and make it start at the very left of the page. Any ideas?

DianaAyub
 
tallacman replied on at Permalink Reply
tallacman
It is probably your html structure, depending on the theme. But it could be the css, too. Whats the url?
DianaAyub replied on at Permalink Reply
DianaAyub
The website's address is currently at http://graphprime.info/softd – I want the red stripe to spread across the width of the page (start at the very left ...) I think it has something to do with the main.css file; I just don't know what...
EdwardMartinIII replied on at Permalink Reply
EdwardMartinIII
When you say "one area," do you mean "the contents of one block"?

If so, then you should be able to modify how that single block is displayed by selecting it, clicking Design, and looking into the custom CSS tab.

If you are trying to align text, these are the parameters for text-align:

http://www.w3schools.com/cssref/pr_text_text-align.asp...
DianaAyub replied on at Permalink Reply
DianaAyub
When I say one "area" I mean the areas defined in the php of the page types. For example in 'Left_sidebar.php' 'Left-sidebar-inner' is defined as an area, and in the main.css we assign the css styles to this specific area.
At the beginning of main.css, I have:
html{
width:auto;
height:auto;
}

which makes for all areas in the page be centered. What I want is to make one of these areas spread across the whole width of the page.

An alternative would be this: I keep this new area centered, but I specify that its background color spreads across the whole visible width of the page... how do I do that?
EdwardMartinIII replied on at Permalink Reply
EdwardMartinIII
Well, I might be misunderstanding you, but it seems that you can put any section of a website between a couple of DIV tags or SPAN tags and then apply any sort of formatting to those tags.
DianaAyub replied on at Permalink Reply
DianaAyub
true. my question is: what formatting should I write to get what I explained I needed before?
EdwardMartinIII replied on at Permalink Reply
EdwardMartinIII
I can't figure out what you're trying to do yet. The only red stripe I see on the page is in the logo, and that's an image file.

If you have a specific section in the HTML code that you want aligned differently, then you enclose it in SPAN or BLOCK tags, with a text-align style property.

Do you know how to do that?

Regions can have text-align applied to them in the CSS, too, if you want to do it from that direction.
Steevb replied on at Permalink Reply
Steevb
To make an area centered you need margins.

So an area is for example:
.content {margin:10px auto}


Which means a ten pixel space top and bottom and auto left to right.

Does that help?
mmdan replied on at Permalink Reply
mmdan
Hey If you want just one container moved to the left, edit the main.css and chnage the left margin to negative px;

So for eg -300px;

Cheers

Dan
Steevb replied on at Permalink Reply
Steevb
Your markup is a little weird, but you could try this:

#header {height:120px;width:100%;margin:0;border-bottom: 2px solid #ff0000}
DianaAyub replied on at Permalink Reply
DianaAyub
In the end I removed the red stripe (it was where the testimonials at the bottom of the page are.)
anyway I think dan's suggestion seems the most logical... I guess I still have a lot to learn when it comes to coding! thanks everyone!