|
Welcome
Guest
|
Register
| Login
|
|
|
| Index | Recent Threads | Unanswered Threads | Who's Online | User List | Help |
Killersites.com Forum
General Web Design
CSS - Styling your pages with Cascading Style Sheets.
Thread: Standard Website Layouts
|
| No member browsing this thread |
|
Thread Status: Active Thread Type: Sticky Thread Total posts in this thread: 39
|
|
| Author |
|
billyboy
Advanced Member Joined: Sep 3, 2005 Post Count: 2206 Status: Offline |
@henns Centering any fixed width layout makes more sense to avoid huge amount of empty space on the right of screen at higher resolutions. The widest a fixed width layout can be to avoid sidescroll at 800x600 is around 760px. A user with their screen resolution set to 1280x1024 would have around 500px of empty space if that was left align. Centering evens out the empty space and looks better. @j.watts There's a couple of examples of what you're talking about at Stu Nicholls CSS Play: Fixed Layouts. Adding fixed positioning to the CSS for whatever element you want to keep from scrolling is all that's needed for standards compliant browsers. But for IE you have to add height 100% and overflow: auto to html and body and then apply absolute positioning to the element. ---------------------------------------- Quiquid latine dictum sit altum viditur |
||
|
|
j.watts
Stranger Australia Joined: Oct 12, 2006 Post Count: 2 Status: Offline |
Got it - good tip, thanks. Jeff |
||
|
|
henns20
Newbie United States Joined: May 3, 2006 Post Count: 31 Status: Offline |
thx for the clarification billy boy henns20 |
||
|
|
michaelv
Stranger Joined: Oct 28, 2006 Post Count: 2 Status: Offline |
 I don't understand ... What is a CSS "hack" ? ---------------------------------------- You don't have to be ignorant to make bad web pages, but it helps! |
||
|
|
daddyalfie
Advanced Member Joined: Jul 17, 2006 Post Count: 192 Status: Offline |
A "hack" is a general rule to "fool" a certain browser to comply with rules. Internet Explorer is infamous for having its own interpretation of the rules, as set fourth by the "World Wide Web Consortium." (W3C). There are certain "rules" IE does not understand, so some styling elements in CSS can be "hidden" from IE, and applied only to comliant browsers. (Actually it is the other way around. First you apply the rule IE understands, then you apply rules only compliant browsers understand, but in a form that hides it from IE.) Check within this forum for do's and don'ts. Stefan has some awesome posts! I do not have specific search items, but I would suggest "CSS hacks" as a start. Alfie (Am I right Gurus?) ---------------------------------------- If you can't sleep, try lying on the end of the bed. Then you might drop off. - Mark Twain ---------------------------------------- [Edit 3 times, last edit by daddyalfie at Nov 5, 2006 5:54:34 PM] |
||
|
clair
Newbie U.S. Joined: Oct 29, 2006 Post Count: 33 Status: Offline |
As I said I would do elsewhere in this forum, I have put up a simple 2-col layout using Doc type Strict. It is valid HTML(strict) and CSS. Though the CSS validator tosses out warnings about not having colors set. (If they needed to be set, I would have set them! Grrr.) http://www.vt2000.com/2colcss The only hack in it is the one for Macs included in the tabbed menus which I used -- courtesy of exploding-boy.com. Both the HTML and the CSS are straightforward, nothing fancy, just clean and solid. The layout works fine in IE6, IE7, FF2, and O9. It has its own directory on my server so it will have a permanent home. The CSS is included in the HTML file. Hope it helps someone. (If you are a newbie, please help yourself to it, and also I would strongly advise getting Meyer's CSS, and also Budd et al. CSS Mastery.) Clair Clair ---------------------------------------- [Edit 1 times, last edit by clair at Dec 11, 2006 1:29:11 PM] |
||
|
|
LSW
Advanced Member USA Joined: Nov 27, 2003 Post Count: 6285 Status: Offline |
settimg colors is in case something does not load to ensure that the text is visible. You can set to transparent if you like. But those are just warnings and not errors so can be ignored. |
||
|
|
MacRankin
Advanced Member Joined: Dec 18, 2005 Post Count: 368 Status: Offline |
I'm having another go at creating a more simplified version of my website, so that I can get to grips with this stuff again. Anyway, I was wondering; do you contain the whole body in a wrapper, or do you do as I have in the past and create the wrapper just for floating divs beneath the header and nav bar divs? Also, are there any issues that might crop up as a result of doing either? ---------------------------------------- We Brits do things differently, but we still get shot at! |
||
|
|
NHN
Stranger USA Joined: Feb 1, 2008 Post Count: 1 Status: Offline |
This is very helpful. What would I change if I had a header image that was larger? Say 275 px high and 775 wide? Thanks Colleen |
||
|
|
shadownexusruler
Stranger Joined: Mar 15, 2008 Post Count: 1 Status: Offline |
if i wanted to may a three column website with header and footer what would the css code be to create a fixed width 3 column website |
||
|
|
|
|
Current timezone is GMT May 24, 2013 3:18:32 PM |
