Geekzone: technology news, blogs, forums
Guest
Welcome Guest.
You haven't logged in yet. If you don't have an account you can register now.




Awesome
4841 posts

Uber Geek
+1 received by user: 1097

Trusted
Subscriber

Topic # 18292 5-Jan-2008 13:52
Send private message

I'm doing a website at the moment which I want to make fully XHTML and CSS compliant.

The layout I want will be something like this:



I want the area labled 'B' (Which will have a coloured BG) to grow automatically to the same height as 'A', which whil change in height from page to page. The width of 'B' will remain static and 'A' will dynamically adjust based on window size.

A is the main content area, B will be used for a new feed and C is where the page footer will be.

Is anyone able to give me some advise as to how my CSS should look to achieve this?

Create new topic
1262 posts

Uber Geek
+1 received by user: 166


  Reply # 103923 9-Jan-2008 23:42
Send private message

Personally, being a bit of a pragmatist, I'd say screw it and use a table. It doesn't make your xhtml or css invalid, tables are still part of the spec, you can still put the nice little validation image on your page in good concience, it just saves you about 2 days of farting about and loss of about half of your hair folicles trying to do what is a 1 minute job with a table.




---
James Sleeman
I sell lots of stuff for electronic enthusiasts...




Awesome
4841 posts

Uber Geek
+1 received by user: 1097

Trusted
Subscriber

  Reply # 104006 10-Jan-2008 13:49
Send private message

I'd rather spend the time and do it properly. Its for my company website and I want it done properly.

 
 
 
 


I iz your trusted friend
5831 posts

Uber Geek
+1 received by user: 145

Mod Emeritus
Trusted
Lifetime subscriber

  Reply # 104017 10-Jan-2008 14:30
Send private message

There is no fault in using table in XHTML... everyone seem to think that to be XHTML and CSS compliant to take out table, which is wrong thinking.

You can use table, to its most cleanest form and still use CSS to apply styles and it's still very very very much XHTML compliant.

If you want to explore DIV-based layout, then you'll need to create a faux coloured background image (say width of B x 5px high), which has the width of the B, and right aligned, repeat-y for the container that holds A and B.




Internet is my backyard...

 

«Geekzone blog: Tech 'n Chips Takeaway» «Personal blog: And then...»

 

Please read the Geekzone's FUG

 




Awesome
4841 posts

Uber Geek
+1 received by user: 1097

Trusted
Subscriber

  Reply # 104248 11-Jan-2008 16:04
Send private message

I've changed the way i'm going to do this a bit.

I want to use DIV based layout.

A will be variable width and height based on the content, B will be fixed width but variable height based on the content and C will need to be below both A and B.

I currently have this working how I want in IE7 HOWEVER if I view it in Firefox or Opera the footer (Section C) appears at top, kind of behind A and B. It looks how I want it to look in IE7.

Is someone able to take a look at the code and give me an idea how I can fix this in FF/Opera?

http://www.itechsystems.co.nz/v2test/index.php for the HTML and http://www.itechsystems.co.nz/v2test/style.css for the style sheet.



Awesome
4841 posts

Uber Geek
+1 received by user: 1097

Trusted
Subscriber

  Reply # 104250 11-Jan-2008 16:13
Send private message

Sorted it myself. DIV needed a float:left;

Create new topic


Donate via Givealittle


Twitter »

Follow us to receive Twitter updates when new discussions are posted in our forums:



Follow us to receive Twitter updates when news items and blogs are posted in our frontpage:



Follow us to receive Twitter updates when tech item prices are listed in our price comparison site:





News »

Orcon announces new always-on internet service for Small Business
Posted 18-Apr-2019 10:19


Spark Sport prices for Rugby World Cup 2019 announced
Posted 16-Apr-2019 07:58


2degrees launches new unlimited mobile plan
Posted 15-Apr-2019 09:35


Redgate brings together major industry speakers for SQL in the City Summits
Posted 13-Apr-2019 12:35


Exported honey authenticated on Blockchain
Posted 10-Apr-2019 21:19


HPE and Nutanix partner to deliver hybrid cloud as a service
Posted 10-Apr-2019 21:12


Southern Cross and ASN sign contract for Southern Cross NEXT
Posted 10-Apr-2019 21:09


Data security top New Zealand consumer priority when choosing a bank
Posted 10-Apr-2019 21:07


Samsung announces first 8K screens to hit New Zealand
Posted 10-Apr-2019 21:03


New cyber-protection and insurance product for businesses launched in APAC
Posted 10-Apr-2019 20:59


Kiwis ensure streaming is never interrupted by opting for uncapped broadband plans
Posted 7-Apr-2019 09:05


DHL Express introduces new MyDHL+ online portal to make shipping easier
Posted 7-Apr-2019 08:51


RackWare hybrid cloud platform removes barriers to enterprise cloud adoption
Posted 7-Apr-2019 08:50


Top partner named at MYOB High Achievers Awards
Posted 7-Apr-2019 08:48


Great ideas start in Gisborne with hackathon event back for another round
Posted 7-Apr-2019 08:42



Geekzone Live »

Try automatic live updates from Geekzone directly in your browser, without refreshing the page, with Geekzone Live now.


Support Geekzone »

Our community of supporters help make Geekzone possible. Click the button below to join them.

Support Geezone on PressPatron



Are you subscribed to our RSS feed? You can download the latest headlines and summaries from our stories directly to your computer or smartphone by using a feed reader.

Alternatively, you can receive a daily email with Geekzone updates.