CSS Positioning: 2 Column Blog Theme: Assorted: Newbie Questions
in [CSS]
|
From: Steve on 9 May 2010 01:05 Hi all; I'm a newbie to CSS. I'm trying to make a pretty basic basic blog theme: - header on top - two columns underneath, thin left column for links, wide right column for content - footer on the bottom The whole thing centered. I've been reading the O'Reilly CSS book and a number of good tutorials. It seem that once I fix one problem in the way of getting my layout I create two more :) I finally decided to get things as simple as possible and as close to what I want before asking some questions. Here is a URL to the sample layout page I've been working on: http://rabbitwise.org/exp/index.html Here is a URL to the style sheet for it: http://rabbitwise.org/exp/style.css So far, I like that the content degrades gracefully as I resize the browser and that the footer keeps getting pushed towards to the bottom when I add text to either the orange side bar or the green main column. What I haven't been able to accomplish, without, messing up what I have is: 1. Keeping the green "main" column from encroaching to the left under the orange side bar column. 2. Centering the wrapper div in the browser 3. Filling up all of the wrapper div so that none of it shows. Again, fixing one of these has caused new problems. Any ideas? Any tips for getting all of this to work in IE 6 -> 8, Safari and Firefox? Thanks much in advance for any information. Steve
From: dorayme on 9 May 2010 02:25 In article <56a69853-029c-4e64-94d2-cf227bc9aa03(a)h9g2000yqm.googlegroups.com >, Steve <tinker123(a)gmail.com> wrote: > Hi all; > > I'm a newbie to CSS. > OK, I can take you part of the way, <http://dorayme.netweaver.com.au/steve.html> > I'm trying to make a pretty basic basic blog theme: > - header on top > - two columns underneath, thin left column for links, wide right > column for content > - footer on the bottom > > The whole thing centered. > > I've been reading the O'Reilly CSS book and a number of good > tutorials. > Use a doctype, use Strict 4.01 for now. Make sure to use units for quantities in your CSS. See your CSS. Have a go at validating and seeing what needs to be done from there. > It seem that once I fix one problem in the way of getting my layout I > create two more :) > > I finally decided to get things as simple as possible and as close to > what I want before asking some questions. > > Here is a URL to the sample layout page I've been working on: > http://rabbitwise.org/exp/index.html > > Here is a URL to the style sheet for it: > http://rabbitwise.org/exp/style.css > > So far, I like that the content degrades gracefully as I resize the > browser and that the footer keeps getting pushed towards to the bottom > when I add text to either the orange side bar or the green main > column. > > What I haven't been able to accomplish, without, messing up what I > have is: > > 1. Keeping the green "main" column from encroaching to the left under > the orange side bar column. > > 2. Centering the wrapper div in the browser > > 3. Filling up all of the wrapper div so that none of it shows. > > Again, fixing one of these has caused new problems. > > Any ideas? > > Any tips for getting all of this to work in IE 6 -> 8, Safari and > Firefox? > > Thanks much in advance for any information. > > Steve -- dorayme
From: Albert Ross on 11 May 2010 12:39 On Sat, 8 May 2010 22:05:01 -0700 (PDT), Steve <tinker123(a)gmail.com> wrote: >Hi all; > >I'm a newbie to CSS. > >I'm trying to make a pretty basic basic blog theme: >- header on top >- two columns underneath, thin left column for links, wide right >column for content >- footer on the bottom > >The whole thing centered. > >I've been reading the O'Reilly CSS book and a number of good >tutorials. > >It seem that once I fix one problem in the way of getting my layout I >create two more :) See if some of this guy's ideas work for you http://matthewjamestaylor.com/blog/-website-layouts also listen to Dorayme Sometimes it's easier to "steal" someone else's work and then decipher how it is done afterwards (a lot of such stuff is now done in xhtml but conversion to html strict isn't too arduous)
|
Pages: 1 Prev: IE vs. Screenreader Next: CSS Positioning: 2 Column Blog Theme: Assorted: Newbie Questions |