Re: [WSG] CSS height/padding
Hi Christian, Use option 1 with em units instead of pixels for your top and bottom padding. The padding will increase as the text resizes. Al On 8/1/07, Christian Fagan <[EMAIL PROTECTED]> wrote: > > Hi all, > > I have previously tried to create a horizontal page navigation with a > fixed height but there seems to be two distinct problems with the two > methods that I have used to date. > > 1) The first method employs top and bottom padding on elements to > vertically centre the text within the anchor box. This method works > fine, until the text is re-sized. > 2) The second method involves declaring a height for the element but > then the text is top aligned vertically (looks ugly). > > I have also tried declaring top padding combined with a height value to > lessen the text resize issue but I would like to hear from anyone who > knows a way to align text vertically, as well as assign a set height to > elements (particularly elements in a horizontal nav structure). > > Thanks. > > -- > Christian Fagan > Fagan Design > > fagandesign.com.au > [EMAIL PROTECTED] > > > > > *** > List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm > Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm > Help: [EMAIL PROTECTED] > *** > > *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] 100% height
Try this one... http://www.strictlycss.com/examples/fluid-css-layout-with-faux-columns-1.asp Al *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Disappearing positioned footer in IE7 - works in IE6
Sorry, I should have mentioned it only works in Strict mode.
This is an excellent example of why not to use hacks, but use your design
skills.
Agreed, it's a mess, but Cole asked for a hack version. Conditional comments
is the best method.
On 4/25/07, Stuart Foulstone <[EMAIL PROTECTED]> wrote:
This is an excellent example of why not to use hacks, but use your design
skills.
Stuart
On Tue, April 24, 2007 1:07 pm, al morris wrote:
> Hi,
>
> IE 7 now supports the *html hack, so the 'position: relative' style is
> being
> applied. You can still add hacks for IE 6 and/or IE 7 but it's tricky..
>
> If you need to send something to IE6 and nothing else: use the
underscore
> attribute hack (_border:1px solid pink;)
>
> If you want to send something to IE7 AND IE6, use the attribute hack
> (*border:1px solid black;).
>
> If you want to send something to IE7 and NOT IE6, use a combination
> (*border:1px solid black; _border:1px solid pink;).
>
> Try adding an underscore in the IE 6 class...
>
> *html #bottom_nav { /*Enables the footer to be positoned below the
> wrapper in IE6*/
>
> _position: relative;
>
> bottom: -75px;
>
> right: 25px;
>
> text-align: right;
>
> width: 100%;
>
> height: 50px;
>
> }
>
>
> Al
>
> On 4/24/07, Cole Kuryakin <[EMAIL PROTECTED]> wrote:
>>
>> Hello All –
>>
>>
>>
>> I was having an absolutely-positioned footer problem in IE6 which was
>> fixed with the following:
>>
>>
>>
>> #bottom_nav {/*Compliant Browsers*/
>>
>> position: absolute;
>>
>> bottom: -75px;
>>
>> right: 25px;
>>
>> text-align: right;
>>
>> width: 100%;
>>
>> height: 50px;
>>
>> }
>>
>>
>>
>> *html #bottom_nav { /*Enables the footer to be positoned below
the
>> wrapper in IE6*/
>>
>> position: relative;
>>
>> bottom: -75px;
>>
>> right: 25px;
>>
>> text-align: right;
>>
>> width: 100%;
>>
>> height: 50px;
>>
>> }
>>
>>
>>
>> Yes, well, now that IE 7 has come out the footer ***Poof!*** vanishes –
>> like it did under IE6 previous to the implementation of he above *html
>> declaration.
>>
>>
>>
>> Could someone give me a lead on what to do about this issue in IE 7?
>>
>>
>>
>> Unfortunatly, I am not allowed to use conditional comments to issue
>> version specific declarations – which makes problems like these very
>> difficult to deal with.
>>
>>
>>
>> If you'd like to see the problem live, please go to
>> http://terashock.terapad.com/ in FF or IE6 and scroll to the bottom of
>> the
>> page to view how the footer is suppose to look; then view the same page
>> in
>> IE7.
>>
>>
>>
>> Any and all assistance greatly appreciated!
>>
>>
>>
>> Cole
>>
>>
>>
>>
>>
>>
>>
>> ***
>> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
>> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
>> Help: [EMAIL PROTECTED]
>> ***
>
>
> ***
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [EMAIL PROTECTED]
> ***
>
--
Stuart Foulstone.
http://www.bigeasyweb.co.uk
BigEasy Web Design
69 Flockton Court
Rockingham Street
Sheffield
S1 4EB
Tel. 07751 413451
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Disappearing positioned footer in IE7 - works in IE6
Hi,
IE 7 now supports the *html hack, so the 'position: relative' style is being
applied. You can still add hacks for IE 6 and/or IE 7 but it's tricky..
If you need to send something to IE6 and nothing else: use the underscore
attribute hack (_border:1px solid pink;)
If you want to send something to IE7 AND IE6, use the attribute hack
(*border:1px solid black;).
If you want to send something to IE7 and NOT IE6, use a combination
(*border:1px solid black; _border:1px solid pink;).
Try adding an underscore in the IE 6 class...
*html #bottom_nav { /*Enables the footer to be positoned below the
wrapper in IE6*/
_position: relative;
bottom: -75px;
right: 25px;
text-align: right;
width: 100%;
height: 50px;
}
Al
On 4/24/07, Cole Kuryakin <[EMAIL PROTECTED]> wrote:
Hello All –
I was having an absolutely-positioned footer problem in IE6 which was
fixed with the following:
#bottom_nav {/*Compliant Browsers*/
position: absolute;
bottom: -75px;
right: 25px;
text-align: right;
width: 100%;
height: 50px;
}
*html #bottom_nav { /*Enables the footer to be positoned below the
wrapper in IE6*/
position: relative;
bottom: -75px;
right: 25px;
text-align: right;
width: 100%;
height: 50px;
}
Yes, well, now that IE 7 has come out the footer ***Poof!*** vanishes –
like it did under IE6 previous to the implementation of he above *html
declaration.
Could someone give me a lead on what to do about this issue in IE 7?
Unfortunatly, I am not allowed to use conditional comments to issue
version specific declarations – which makes problems like these very
difficult to deal with.
If you'd like to see the problem live, please go to
http://terashock.terapad.com/ in FF or IE6 and scroll to the bottom of the
page to view how the footer is suppose to look; then view the same page in
IE7.
Any and all assistance greatly appreciated!
Cole
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] background image
Most likely it's a bug in IE, try adding position: relative to fix it. On 3/2/07, Ricky Onsman <[EMAIL PROTECTED]> wrote: Your background doesn't show up in my IE6. Rolf and Paul's comments are both worth checking out. Ricky > -Original Message- > From: [EMAIL PROTECTED] > [mailto:[EMAIL PROTECTED] On Behalf Of kevin mcmonagle > Sent: Friday, 2 March 2007 5:49 AM > To: wsg@webstandardsgroup.org > Subject: [WSG] background image > > Hi, > Just one more question about this page: > > http://www.arena7.ie/index2.html > > When viewing the above page with ie6 pc can you see the > diagonal striped bacground pattern? > I have ie6 running locally on an old machine thats offline > and its not showing up. > > thanks for all the help > > -best > kvnmcwebn > www.mcmonagledesign.com > > > > > *** > List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm > Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm > Help: [EMAIL PROTECTED] > *** > *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
