[solved] *BB#3* - who wants to see a quote anyway...

Fri, 2008-08-22 14:15

#1

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Make .withquote {overflow:

Make .withquote {overflow: hidden;} to create a new block formatting context. For IE, set hasLayout. I don't see where you've tried to put the quotes on the pullquote.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Fri, 2008-08-22 14:22

#2

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Never mind. Put the quote

Never mind. Put the quote background image on the pullquote and on the p, apply the close-quote. I'm not happy with your use of the classes.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Fri, 2008-08-22 14:28

#3

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Never mind the never-mind.

Never mind the never-mind. Why didn't you use blockquote instead of the dv.withquote?

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Fri, 2008-08-22 14:47

#4

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Quote:Never mind the

Quote:

Never mind the never-mind.

Now I'm truly confused!

Quote:

Why didn't you use blockquote instead of the dv.withquote?

I did originally - I just changed it tonight because I couldn't add a class to it.

Why don't you like my classes? I did try taking all that out and just floating left and right but couldn't contain the left float

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Fri, 2008-08-22 14:49

#5

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

I've just changed it - it's

I've just changed it - it's almost there

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Fri, 2008-08-22 14:54

#6

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Like you, I thought

Like you, I thought HasLayout was the problem too , but when I stick width:400px on Withquote (the left bit), it drops below the Pullquote.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Fri, 2008-08-22 15:26

#7

David Laakso

Offline

Enthusiast

US

Last seen: 13 years 40 weeks ago

US

Joined: 2008-07-18

Posts: 265

Points: 0

Not quite sure what you are

Not quite sure what you are after. Something like this?
Online
http://chelseacreekstudio.com/ca/cssd/bake.htm
For arcives below:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>About bb</title>
<meta name="robots" content="noindex, nofollow">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="description" content="Retreat to a holiday with a slice of history at the Old BB">
<meta name="keywords" content=" retreat, holiday, accommodation, spiritual, wellness, wellbeing, history, 3 bedrooms, sleeps 8, workshops, AV room, tariffs, bookings, gardens">
<style type="text/css">*
{
	margin: 0em;
	padding: 0em;
}
 
 
a
{
	color: #8DA359;
	text-decoration: underline;
	border: 0;
}
 
a:hover
{
	text-decoration: none;
}
 
img {border: 0; }
 
body
{
	background-color: #F7DC83;
	background-image: url('bbimages/BB05_a4.gif');
	background-repeat: repeat-x;
	color: #37371E;
	font-family: "Lucida Sans Unicode", "Arial Rounded MT Bold", sans-serif;
	line-height: 1.4em;
	font-size: 100%;
	height: 1%;
}
 
html{
font-size: 100%;
}
 
 
#outer
{
  width: 46.25em;
	min-width: 620px;
	max-width: 780px;
	margin: 1em auto;
	background-color: #FEFCF3;	
	background-image: url('bbimages/a3.gif');
	background-repeat: repeat-x;
	padding: 1.0em;
	border-top: solid 1px #97691C;
}
 
#outer2
{
	border: dotted 2px #EFEAD1;
	padding: 1.0em;
}
 
#menu
{
	background-color: #6C7424;
	background-image: url("images/a1.gif");
	background-repeat: repeat-x;
	color: #ffffff;
	text-align: center;
	line-height: 1.5em;
	padding: 0.8em;
	border-bottom: solid 1px #ffffff;
	border-top: solid 1px #6D7B34;
}
 
#menu a
{
	color: #ffffff;
	text-decoration: none;
}
 
#menu ul
{
	list-style: none;
	padding: 0;
}
 
#menu li
{
	font-size: 0.9em;
	font-weight: bold;
	display: inline;
}
 
#menu li a
{
	padding: 0.8em;
}
 
#menu li a:hover 
{
	background-color: #7C8628;
	background-image: url("images/a2.gif");
	background-repeat: repeat-x;
}
 
#header
{
	padding: 0.8em 1.2em 1.2em 1.2em;
}
 
#header h1
{
	color: #97691C;
	text-transform: lowercase;
  font-family: "Arial Rounded MT Bold", "Lucida Sans Unicode", sans-serif;
  font-size: 2.5em;
	font-weight: normal;
	letter-spacing: -0.05em;
}
 
#header h2
{
	position: relative;
	font-family: "Arial Rounded MT Bold", "Lucida Sans Unicode", sans-serif;
	text-transform: lowercase;
	font-weight: bold;
	margin: 0.5em 0;
	font-size: 1.5em;
	color: #97691C;
}
 
#content
{
  position: relative;
  overflow: hidden;
  text-align: left;
	padding: 0em 1.2em 0.5em 1.2em;
	display: inline-block;
}
 
#content p
{
  font-size: 100%;
	text-align: justify;
	margin-bottom: 1.0em;
	color: #4F4F2B;
}
 
#content h3
{
	font-size: 1.5em;
	color: #97691C;
	font-family: "Arial Rounded MT Bold", "Lucida Sans Unicode", sans-serif;
	border-bottom: #CECF8F dashed 2px ;
	margin: 1.5em 0 1.0em 0;
}
 
#daisylist
{
  position: relative;
	list-style: none;
	line-height: 1.8em;
}
 
#daisylist li
{ 
position:relative;
background: url("bbimages/daisy_yl.gif") no-repeat 0 50%;
padding: 0.5em 2.5em;
margin: 0.5em 2em;
text-align: left;
color: #8DA359;
display: block; 
}
 
#gallery 
{
  margin: 0;
  padding: 0;
  margin: 1.5em 0;
  list-style: none;
}
 
#gallery li 
{
  display: inline;
}
 
 
#quote
{ border:1px solid red; 
width: 95%;
background: #FEFCF3; margin: 10px auto 0 auto; 
}
 
#lft {border-right:1px solid red;width: 380px;display:table;
font-family: Georgia, "Trebuchet MS", serif;
zoom: 1; 
} 
 
#rht, #rht-a 
{  background: url("http://bbakehouse.freehostia.com/bbimages/unquote.gif") no-repeat left top;
border-left: 1px solid red;
border-bottom: 1px solid red;
 
float: right; 
width: 220px;
 
}
 
#rht-a
{  background: url("http://bbakehouse.freehostia.com/bbimages/unquote.gif") no-repeat right bottom;
border: none;
}
 
 
#rht p
{  
color: #77927f;text-align:right;
font: 120% "Lucida Sans Unicode", "Arial Rounded MT Bold", sans-serif;
margin: 0 25px 0 0;
}
 
.
 
 
.floathouse {
  float: right;
  height: 120px;
  width: 126px;
  margin: 0 0 0 2em;
  }
 
.floatbird1 {
  float: left;
  height: 56px;
  width: 75px;
  margin: 2.5em 0 0 0;
  }
 
.floatbird2 {
  float: right;
  height: 56px;
  width: 75px;
  margin: 2.5em 0 0 0;
  }
 
.centermap { 
  height: 296px;
  width: 250px;
  margin: 2em auto;
  vertical-align: bottom;
  border: #BB8222 solid 3px;
  display: block;
  }
 
.prev {
  position: relative;
  float: left;
  height: 30px;
  width: 30px;
  margin: 2.5em 0 0 0;
  padding-top: 1.2em;
  }  	
 
.next {
  position: relative;
  float: right;
  height: 30px;
  width: 30px;
  margin: 2.5em 0 0 0;
  padding-top: 1.2em;
  }
 
 
#nukunu
{
text-align: justify;
width: 300px;
font-size: 0.8em;
font-style: italic;
font-weight: bold;
line-height: 1.2em;
margin: 2.5em 0 2em 15em;
color: #BB8222;
display: block;
}
 
#nukunu p
{
text-align: center;
}
 
 
/*-- TABLE, TARIFFS --*/
table#tariffs {
  background: #FDFDDF;
	padding: 2px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs th {
  color: #BB8222;
  background: #FFFFCC;
  text-align: center;
  font-family: arial, sans-serif;
	padding: 10px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs td {
	line-height: 1.2em;
	padding: 5px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs p {
  font-family: arial, sans-serif;
	font-size: 0.9em;
	color: #000;
	line-height: 1.2em;
  padding: 10px 10px 0 10px;}
 
.accomm {
  font-size: 1.1em;
}
 
#footer
{
	border-top: dotted 2px #EFEFD6;
	padding-top: 1.0em;
	font-family: "Arial Rounded MT Bold", arial, sans-serif;
	font-size: 0.8em;
	color: #AFA162;
	clear: both;
}
</style>
</head>
<body>
 
<div id="outer">
 
	<div id="outer2">
	<a name="top"></a>
		<div id="header">
			<h1>Burra Bakehouse Retreat Centre</h1>
			<h2>...retreat to a Slice of History</h2>
		</div>
 
		<div id="menu">
			<ul>
 
				<li><a href="index.html">Home</a></li>
				<li><a href="rooms.html">The Rooms</a></li>
				<li><a href="gardens.html">The Gardens</a></li>
				<li><a href="tariffs.html">Tariffs &amp; Bookings</a></li>
				<li><a href="aboutburra.html">About Burra</a></li>
 
			</ul>
		</div>
 
		<div id="content">
 
 
				<h3>The Heritage of Burra Preserved</h3>
 
				<p>The <a href="http://www.burrahistory.info/" title="external site">Burra History Group</a><img src="bbimages/offsite01a.jpg" alt="external site"> 
        maintains a fascinating and comprehensive website with many old photos 
        and articles. The history of Burra, its pioneers, and their 
        beginnings in this old copper mining town, make absorbing reading.</p>
 
 
 
<div id="quote">
<div id="rht">
<div id="rht-a">
 <p>...interested parties 
 resolved into two groups: the 
 &#8216;Nobs&#8217; and the 
 &#8216;Snobs&#8217;</p>
</div>  
</div>
<div id="lft"> 
<p>The story of the mine began in 1845 with the chance discovery 
of copper ore by a shepherd near Burra Creek.  Soon after, a similar find 
was made by another shepherd further to the north.  News of the discovery 
reached Adelaide, a town already infected with mining mania because of 
the success of the recently opened Kapunda mine.  The struggle for possession 
of this new copper bearing land quickly followed.</p>
<p>The interested parties resolved into two groups: the "Nobs" and the 
"Snobs".  The Nobs were capitalists and included the owners of Kapunda mine.  
The Snobs were shopkeepers and merchants from Rundle and Hindley Streets in Adelaide.</p> 
</div> 
</div> 
 
<!-- <div style="clear:both;"></div> --> 
 
<p>To read more about the Burra Burra Mine - known as "The Monster Mine" - go to the History Group's main page link given 
above and choose Burra Mine from the menu (unfortunately there is no direct link to this article).</p>
 
<p>Burra was declared a State Heritage Area in 1993.</p> 
 
 
        <div class="centermap">
        <img src="bbimages/bb_map.png" alt="Adelaide to Burra map">
        </div>
 
 
 
			<div class="prev">
			<a href="tariffs.html"><img src="bbimages/prev_yl.jpg" title="Tarrifs &amp; Bookings" alt="Previous"></a>	
			</div>
 
			<div class="floatbird2">
			<a href="#top"><img src="bbimages/bb_topbird2.jpg" title="Go to top of page" alt="Top of page"></a>
			</div>
 
		</div>
 
		<div id="footer">
			<p>&copy; Karuna Consultancy Pty Ltd  ABN 36 094 877 317<br>
 
      <span style="font-size: 0.7em;">&nbsp; &nbsp; &nbsp; Design by 
      <a href="http://www.freecsstemplates.org/">Free CSS Templates </a>has been modified.</span></p>
		</div>
 
	</div>
</div>
 
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-UA-4918306");
pageTracker._initData();
pageTracker._trackPageview();
 
</script>
 
</body>
</html>

Fri, 2008-08-22 16:13

#8

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

What I said before? Never mind.

Take a look at this.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator"
        content=
        "HTML Tidy for Linux/x86 (vers 6 November 2007), see <a href="http://www.w3.org" rel="nofollow">www.w3.org</a>" />
 
  <title>About BB</title>
  <meta http-equiv="content-type"
        content="text/html; charset=utf-8" />
  <link rel="stylesheet"
        type="text/css"
        href="aboutburra_files/bbakehouse.css" />
  <style type="text/css">
/*<![CDATA[*/
 
  blockquote {
    font-size: 0.9em;
    padding-left: 1.5em;
    overflow: hidden;
    zoom: 1;  /*for IE <7*/
    }
 
  blockquote p {
    text-indent: -.5em;                  /*value equals width of quote-mark face*/
    }
 
  blockquote p:before {
    content: open-quote;
    }
 
  blockquote p:after {
    content: close-quote;                 /*we have to close each paragraph else
                                          following quotes would all be inner
                                          quotes*/
    visibility: hidden;                   /*so we hide them until the last
                                          paragraph*/
    }
 
  blockquote p:last-child:after,
  blockquote p.last-p:after {             /*Opera doesn't grok :last child, so … */
    visibility: visible;
    }
 
  #content {
    overflow: hidden;
    }
 
  #pullquote {
    background:transparent url(aboutburra_files/quote.gif) no-repeat left top;
    color:#6C7424;
    display:block;
    float:right;
    font-family:"Lucida Sans Unicode","Arial Rounded MT Bold",sans-serif;
    font-size:28px;
    line-height:1.5em;
    margin-left:30px;
    opacity:0.2;
    padding: 13px 0 0;
    position:relative;
    text-align:right;
    width:190px;
    }
 
  #pullquote p {
    background:transparent url(aboutburra_files/unquote.gif) no-repeat right bottom;
    margin: 0;
    padding: 0 0 13px;
    }
 
  /*]]>*/
  </style>
</head>
 
<body>
  <div id="outer">
    <div id="outer2">
      <div id="content">
        <h3>The Heritage of B Preserved</h3>
 
        <p>The <cite><a href="http://www.bbhistory.info/"
           title="external site">B History
           Group</a></cite><img src=
           "aboutburra_files/offsite01a.jpg"
             alt="external site" /> maintains a fascinating and
             comprehensive website with many old photos and
             articles. The history of B, its pioneers, and
             their beginnings in this old copper mining town, make
             absorbing reading.</p>
 
        <div id="pullquote">
          <p>...interested parties <small>resolved into two groups:
          the</small> <b>"Nobs" and the "Snobs"</b></p>
        </div>
 
        <blockquote>
          <p>The story of the mine began in 1845 with the chance
          discovery of copper ore by a shepherd near B Creek.
          Soon after, a similar find was made by another shepherd
          further to the north. News of the discovery reached
          Adelaide, a town already infected with mining mania
          because of the success of the recently opened Kapunda
          mine. The struggle for possession of this new copper
          bearing land quickly followed.</p>
 
          <p class="last-p">The interested parties resolved into
          two groups: the "Nobs" and the "Snobs". The Nobs were
          capitalists and included the owners of Kapunda mine. The
          Snobs were shopkeepers and merchants from Rundle and
          Hindley Streets in Adelaide.</p>
        </blockquote>
      </div>
 
      <p>To read more about the Bb Mine - known as "The
      Monster Mine" - go to the History Group's main page link
      given above and choose b Mine from the menu
      (unfortunately there is no direct link to this article).</p>
 
      <p>B was declared a State Heritage Area in 1993.</p>
    </div>
  </div>
</body>
</html>

Embedded styles override existing styles where applicable.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Fri, 2008-08-22 18:50

#9

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

Can I just add.. oh never

Can I just add.. oh never mind

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sat, 2008-08-23 01:47

#10

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

David wrote:Not quite sure

David wrote:

Not quite sure what you are after. Something like this?

Note quite David. I may have led you astray just pointing at Mandarin's home page. The pertinent bit was under the heading "Magazine Style Pullquotes" (click it and scroll down on the new page)...but it's okay, Gary grokked what I was getting at

Gary... He's done it! By George, I think he's done it! I just slapped it into a new page to look and will have a tweak though I don't even begin to understand all your new (to me) CSS!!! I've never seen half that stuff before

Hugo wrote:

Can I just add.. oh never mind

...but I should really give it to Gary this time round

Now let's see how well I can mess it all up!

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 02:39

#11

David Laakso

Offline

Enthusiast

US

Last seen: 13 years 40 weeks ago

US

Joined: 2008-07-18

Posts: 265

Points: 0

Smee wrote:David wrote:Note

Smee wrote:

David wrote:

Note quite David. I may have led you astray just pointing at Mandarin's home page. The pertinent bit was under the heading "Magazine Style Pullquotes" (click it and scroll down on the new page)...but it's okay, Gary grokked what I was getting at

"By all means break the rules, and break them beautifully, deliberately and well. That is one of the ends for which they exist."
— Robert Bringhurst (The Elements of Typographic Style)

//mod edit: second quote tag closed --gary

Sat, 2008-08-23 03:09

#12

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Sorry David, I don't quite

Sorry David, I don't quite understand, however I assume you're talking about Gary's code.

I did look at yours first (it has now changed I think) but although it had both quotes in the right place, both were still justified and the Pullquote didn't have any styling? That's why I say it's changed, because it has some now.

It was after midnight though and I faded fast at that point. I'll look again.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 03:10

#13

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

I didn't quote anything Mr

I didn't quote anything Mr Tony!

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 04:33

#14

David Laakso

Offline

Enthusiast

US

Last seen: 13 years 40 weeks ago

US

Joined: 2008-07-18

Posts: 265

Points: 0

Smee wrote:Sorry David, I

Smee wrote:

Sorry David, I don't quite understand, however I assume you're talking about Gary's code.

My reply has nothing to due with Gary or Gary's code. It is a basic and simple concept that the purpose of typography is to make content readable. No more. No less.

Sat, 2008-08-23 04:39

#15

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Smee wrote:I didn't quote

Smee wrote:

I didn't quote anything Mr Tony!

It wasn't you this time.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sat, 2008-08-23 04:55

#16

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Smee wrote:<snip> Gary...

Smee wrote:

Gary... He's done it! By George, I think he's done it! I just slapped it into a new page to look and will have a tweak though I don't even begin to understand all your new (to me) CSS!!! I've never seen half that stuff before

See How-to mark up quotes, originally published at my now-defunct site as quotes.html 25-Jul-2006 23:43. I mention this only because I'm still p*ssed about this, Long Live the Q Tag by Stacey Cordoni of Sept, 2006. I really, really need to get a life. :shrug:

Other than the blockquote, the css is pretty much vanilla, with just a touch of butterscotch.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sat, 2008-08-23 05:02

#17

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Oi you two! A person's

Oi you two! A person's trying to concentrate here Thanks for untangling Gary and for the "clarification" David.

Gary it's up - but my #content is mucking it up I think.
I've also tried David's and played with some span styling but can't get that to work either.

Gary wrote:

Other than the blockquote, the css is pretty much vanilla, with just a touch of butterscotch.

I luuuurve butterscotch and vanilla. Seriously!

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 05:18

#18

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Look at the path to the

Look at the path to the quote/unquote images. /aboutburra_files/unquote.gif That was my local path. It won't do you much good.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sat, 2008-08-23 06:01

#19

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Sorry guys! My ISP went down

Sorry guys! My ISP went down the minute I hit Submit and I've been locked out for the last hour

Thanks for the links Gary...now I understand a bit more

Quote:

Look at the path to the quote/unquote images. /aboutburra_files/unquote.gif That was my local path. It won't do you much good.

Aaaah...off to do it now and reload to see what we will see.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 06:11

#20

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Off you go and have a look

Off you go and have a look then...

What I meant about #content is that something still seems to be overriding the Pullquote alignment. Locally it's right aligned but not when I put it on FF.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 10:45

#21

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

Can you be more

Can you be more specific/explicit about what "something still seems to be overriding the Pullquote alignment. Locally it's right aligned but not when I put it on FF" means? It looks as I would expect it to.

cheer s,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sat, 2008-08-23 11:09

#22

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Quote:It looks as I would

Quote:

It looks as I would expect it to.

I don't know what's wrong then When I plonked your page into my editor and loaded it - it looked bayoodiful - Pullquote was exactly what I wanted i.e. right aligned/left jagged and different text sizes.

When I put the code into my files and loaded them to the server, what I see in FF is a justified Pullquote. :?

Is this my cache perhaps?

ETA: No, I don't think it is the cache (I force refresh all the time and I just viewed it in IE6 and it's justified) - I must have unwittingly changed something else.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 11:39

#23

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

My bad. I was mentally

My bad. I was mentally bypassing the text-align properties.

Consider this:

#pullquote p {
  background:transparent url(bbimages/unquote.gif) no-repeat scroll right bottom;
  margin:0;
  padding:0 0 13px;
  }
 
#content p 
  color:#4F4F2B;
  font-size:100%;
  margin-bottom:1em;
  text-align:justify;
}

and this

#pullquote 
...
  text-align:right;
  width:190px;
  }

Which text-align rule applies to the p?

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sat, 2008-08-23 12:01

#24

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Quote:Which text-align rule

Quote:

Which text-align rule applies to the p?

Answer loaded to site

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 12:10

#25

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

WoooHoooo! Way to go Gary!

WoooHoooo! Way to go Gary! {mwaah} Looks the same in IE toooo!

Now, two itchy bits...

1. I was originally aiming to have the left block left aligned/right ragged. Worth pursuing?

2. I will change the left block text to Georgia to make it more distinct. Do we think the Pullquote should be in Georgia or stay as is?

All opinions considered

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 12:27

#26

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

Georgia

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sat, 2008-08-23 12:43

#27

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

There you go then, have a

There you go then, have a look.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 12:51

#28

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Yes, I think I like it. So

Yes, I think I like it.

So is there anything else that needs tending before I start a new Burnt Bit with the tracker? I'm thinking that, and making sure all the descriptions etc are right, are the only things left?

I shall put solved on the thread though...

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 12:59

#29

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

Looks very nice, good job

Looks very nice, good job both of you.

Re your original post "vlad doesn't like opacity" don't overly worry about css validation, in respect of certain warnings you do need to clarify to vlad which css spec you want him to check your rulesets against i.e css2.1 css3 etc a property might not have been part of an earlier spec but introduced in a later one.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sat, 2008-08-23 13:19

#30

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Aaaw thanks Hugo...but it's

Aaaw thanks Hugo...but it's all due to Gary's being upset with whatshername - I couldn't have done it because I didn't know that story.

Quote:

you do need to clarify to vlad which css spec you want him to check your rulesets against i.e css2.1 css3 etc

Yes, he tripped me up on that a while ago and basically I check against 2.1 now. I did have the defunct -moz thing in there though as well as the "filter" opacity for IE - both of which are now gone.

He still doesn't validate the CSS but I'm not going to worry about his complaints on this one

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 13:27

#31

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

Validate against the latest

Validate against the latest spec you can, -moz and IE properitary stuff won't validate. Mention some of the other warnings and we can clear them up or confirm not to worry about them.

seem to recal that post on blockquotes/q from years back and Gary's consternation at the time and said he should have mentioned something to whatsherface

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sat, 2008-08-23 13:34

#32

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

validated to

validated to css3

http://jigsaw.w3.org/css-validator/validator?warning=1&profile=css3&usermedium=all&uri=http%3A%2F%2Fbbakehouse.freehostia.com%2Faboutburra.html

Move the zoom property to a conditional comment stylesheet for IE only or care not as it's not a problem as such. Backgrounds/colors are potential problems and is the validator being over cautious and unable to acertain whether or how the layout actually stacks as to whether there is potential for disaster.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sat, 2008-08-23 13:58

#33

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Quote:Validate against the

Quote:

Validate against the latest spec you can,

Ah. I thought I was playing safe. I shall change it to CSS3.

Quote:

seem to recal that post on blockquotes/q from years back and Gary's consternation at the time and said he should have mentioned something to whatsherface

I think he should send his brilliant riposte piece to ALA! After all I'm proof of the pudding

Quote:

validated to css3

Ooooh! Look at that - 2 errors gone! One was a "last-child" thing and the other was Vlad telling me the opacity didn't exist in 2.1 but did in 3. Very nice of him.

Quote:

Move the zoom property to a conditional comment stylesheet for IE only or care not as it's not a problem as such.

What, a whole sheet for a zoom property? I don't think so, we know it's good stuff, it doesn't need badges and anyone who knows enough to care about them can run it through the validator themselves.

Quote:

Backgrounds/colors are potential problems and is the validator being over cautious and unable to acertain whether or how the layout actually stacks as to whether there is potential for disaster.

OTOH these I will check out! Thanks Hugo

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sat, 2008-08-23 17:40

#34

gary.turner

Offline

Moderator

Dallas

Last seen: 1 year 12 weeks ago

Dallas

Timezone: GMT-6

Joined: 2004-06-25

Posts: 9776

Points: 3858

I used the zoom property

I used the zoom property because it's so simple, and didn't get in the way of the issues at hand. Any means of setting hasLayout will work. The Holly hack, * html [selector] {height: 1px;} is perfectly safe, as only IE≤6 sees it. Another safe method is Claire's tripswitch hack, which is a favorite of mine.

Both methods will test as valid css.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sun, 2008-08-24 06:25

#35

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Hi Gary - I'm not worried

Hi Gary - I'm not worried about the zoom, as you say, it's simple and it works. Though I'll tuck the other two away for future reference when I do want it to validate

Hugo....

73 Same colors for color and background-color in two contexts #outerImageContainer and #menu a

73 Same colors for color and background-color in two contexts #imageDataContainer and #menu a

334 Same colors for color and background-color in two contexts #overlay and table#tariffs p

These are Vlad's colour complaints and I'm not sure what he's referring to :?
I looked at them but the first named div in each isn't in my code. Maybe this is a name he makes up? Is it #outer or #outer2? It seems to be saying if the menu image isn't there, the white menu text won't show up against the cream bg set on #outer - is that right? But there is a dark green background set on #menu - why or when would it lose that in order for the white/cream to come in to play?

This is the outer and menu code-

#outer
{
  width: 46.25em;
	min-width: 620px;
	max-width: 780px;
	margin: 1em auto;
	background-color: #FEFCF3;	
	background-image: url('bbimages/a3.gif');
	background-repeat: repeat-x;
	padding: 1.0em;
	border-top: solid 1px #97691C;
}
 
#outer2
{
	border: dotted 2px #EFEAD1;
	padding: 1.0em;
}
 
#menu
{
	background-color: #6C7424;
	background-image: url("images/a1.gif");
	background-repeat: repeat-x;
	color: #ffffff;
	text-align: center;
	line-height: 1.5em;
	padding: 0.8em;
	border-bottom: solid 1px #ffffff;
	border-top: solid 1px #6D7B34;
}
 
#menu a
{
	color: #ffffff;                  <span style="color:red"><----------line 73</span>
	text-decoration: none;
}
 
#menu ul
{
	list-style: none;
	padding: 0;
}
 
#menu li
{
	font-size: 0.9em;
	font-weight: bold;
	display: inline;
}
 
#menu li a
{
	padding: 0.8em;
}
 
#menu li a:hover 
{
	background-color: #7C8628;
	background-image: url("images/a2.gif");
	background-repeat: repeat-x;
}

I'm not sure what he's referring to with the #overlay (again, not something I've specified) the bit for line 334 -

table#tariffs {
  background: #FDFDDF;
	padding: 2px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs th {
  color: #BB8222;
  background: #FFFFCC;
  text-align: center;
  font-family: arial, sans-serif;
	padding: 10px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs td {
	line-height: 1.2em;
	padding: 5px;
	border: 1px solid #E0D1B2;
}
 
table#tariffs p {
  font-family: arial, sans-serif;
	font-size: 0.9em;
	color: #000;                    <span style="color:red"><---------line 334</span>
	line-height: 1.2em;
  padding: 10px 10px 0 10px;}
 
.accomm {
  font-size: 1.1em;
}

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

Sun, 2008-08-24 09:34

#36

Hugo

Offline

Moderator

London

Last seen: 7 years 20 weeks ago

London

Joined: 2004-06-06

Posts: 15668

Points: 2806

The seemingly spurious

The seemingly spurious selector/rulesets are comming from the lightbox.css.

I wouldn't be too concerned at these warnings. You must determine that your backgrounds and text color don't conflict and that sufficient backgrounds are stated so that a user defined background doesn't inadvertently match a text color you have set. Define no backgrounds at all and you could find a user who has set application backgrounds to black which along with your black text renders black on black which can be difficult to read.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Sun, 2008-08-24 09:43

#37

Smee

Offline

Elder

Adelaide, Oz

Last seen: 4 years 48 weeks ago

Adelaide, Oz

Timezone: GMT+9.5

Joined: 2007-06-10

Posts: 1596

Points: 340

Duh! It didn't occur to me

Duh! It didn't occur to me to check the lightbox.css

I usually put a colour on the body and my containers so I should be safe on that score - thanks.

Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again

[solved] BB#3 - who wants to see a quote anyway...

Make .withquote {overflow:

Never mind. Put the quote

Never mind the never-mind.

Quote:Never mind the

I've just changed it - it's

Like you, I thought

Not quite sure what you are

What I said before? Never mind.

Can I just add.. oh never

David wrote:Not quite sure

Smee wrote:David wrote:Note

Sorry David, I don't quite

I didn't quote anything Mr

Smee wrote:Sorry David, I

Smee wrote:I didn't quote

Smee wrote:<snip> Gary...

Oi you two! A person's

Look at the path to the

Sorry guys! My ISP went down

Off you go and have a look

Can you be more

Quote:It looks as I would

My bad. I was mentally

Quote:Which text-align rule

WoooHoooo! Way to go Gary!

Georgia

There you go then, have a

Yes, I think I like it. So

Looks very nice, good job

Aaaw thanks Hugo...but it's

Validate against the latest

validated to

Quote:Validate against the

I used the zoom property

Hi Gary - I'm not worried

The seemingly spurious

Duh! It didn't occur to me

User login

Navigation