Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Pages: 1
#1 2008-06-15 09:44:33
- Gallex
- Member
- Registered: 2006-10-08
- Posts: 1,308
mystic gap
i’m useing blockquotes for outputting products and my css looks so:
blockquote {
margin: 8px 0 25px 0;
padding: 0;
font-family: arial, Verdana, "Lucida Grande";
color: #555;
}
blockquote:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}can anyone tell me from where the hell appears this little gap between first and second product? ;)
Offline
Re: mystic gap
very weird. i could not determine where the height was coming from. the way i could get around it is by removing the blockquote:after {
content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;
} and instread using blockquote{overflow:hidden;}
~~~~~~~~~~~~~| monolinea.com | pixilate.com | istockphoto.com/kemie |~~~~~~~~~~~~~
Offline
#3 2008-06-15 11:15:03
- uli
- Moderator
- From: Cologne
- Registered: 2006-08-15
- Posts: 4,306
Re: mystic gap
Gallex, I wasn’t quick enough to check whether kemie’s changes alone did the trick, suddenly your css worked, even on Safari the text is displayed right hand side of the fotos. If you can remember the differences that it needed, I’d be glad to learn from them!
In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links
Offline
#4 2008-06-15 11:22:06
- Gallex
- Member
- Registered: 2006-10-08
- Posts: 1,308
Re: mystic gap
kemie wrote:
very weird. i could not determine where the height was coming from. the way i could get around it is by removing the blockquote:after {
content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;
} and instead using blockquote{overflow:hidden;}
bingo! blockquote{overflow:hidden;} did the trick! with and without blockquote:after {... ,actually. thank’s kemie
but…
IE 6.0 don’t like something :( then the picture width is lesser, the IE 6.0 starts to overflow
take a look first and second product
p.s. this happened before this gap issue already, to be honest
:(
Last edited by Gallex (2008-06-15 11:23:31)
Offline
Re: mystic gap
As we know, blockquotes should be used only for long quotes. Therefor, why do you use blockquotes for the product list instead of divs? In example, search engines will think that the products are quotes from somewhere else :)
To add, there is uls inside p-elements in the product list too – paragraphs can not contain block-level elements, like list nor divs as they are paragraphs. Also notice that there can come some margin conflicts, as if you define margin both to the ul and p, then some browsers might count the margins together 10 + 15 = 25 ;)
Last edited by Gocom (2008-06-15 12:17:24)
Offline
#6 2008-06-15 13:10:48
- Gallex
- Member
- Registered: 2006-10-08
- Posts: 1,308
Re: mystic gap
Gocom wrote:
As we know, blockquotes should be used only for long quotes. Therefor, why do you use blockquotes for the product list instead of divs? In example, search engines will think that the products are quotes from somewhere else :)
because it’s easier to insert them into one article, rather to create the new article for each product. i don’t want to produce huge amount of articles.
right now my product list article looks like this:
bq. <txp:upm_image type=“popup” image_id=“33” />
BRIGHT
-Traksipüksid 60%puuvill/40%polüester
-Värvid:erk oranz/tume hall
——-line break————
bq. <txp:upm_image type=“popup” image_id=“34” />
SIGNAL
-Jope pealis materjal 100% polüamiid
-vooder 100%polüester
——-line break————
and so on…(i removed the ul-s like you suggested above)
are you saying, it will solve the IE6.0 overflow problem then i use div’s instead of bq.-s?
i want to use them in article, how the code above should look like then?
Also notice that there can come some margin conflicts, as if you define margin both to the ul and p, then some browsers might count the margins together
10 + 15 = 25;)
where you see 10+15? both margins in blockquote are 0…
Last edited by Gallex (2008-06-15 13:13:30)
Offline
Re: mystic gap
are you saying, it will solve the IE6.0 overflow problem then i use div’s instead of bq.-s?
Nope, I didn’t say that. I just said that blockquotes shouldn’t be used to that situation in matters of SEO and accessibility as it’s quote not a real content written by you for that webpage. Quote still is quote, and only for quote ;)
I also just said that margins can be count together in some browsers, I didn’t said that it would fix something – completely different case, and so are that 10 + 15 = 25 example, not taken from your styles, plus there was the “as if you define margin both to the ul and p” not blockquote ;)
i want to use them in article, how the code above should look like then?
Write div. In example: " <div> my content </div> " – just use spaces before div’s to avoid automatic paragrap made by textile or notextile...
i removed the ul-s like you suggested above
List can still use list elements you know, and they should, but not within paragraphs nor other inline elements :)
Last edited by Gocom (2008-06-15 13:25:54)
Offline
#8 2008-06-15 14:04:19
- Gallex
- Member
- Registered: 2006-10-08
- Posts: 1,308
Re: mystic gap
Gocom wrote:
Write div. In example:
" <div> my content </div> "– just use spaces before div’s to avoid automatic paragrap made by textile ornotextile...
yep, using div’s didn’t help me, still IE 6.0 overflows… :(
but how to solve this IE 6.0 overflow issue? maybe there is some workaround?
or, how you would build such a little product list page in the first place? without IE overflow problem of course :)
Offline
Offline
#10 2008-06-16 13:07:00
- Gallex
- Member
- Registered: 2006-10-08
- Posts: 1,308
Re: mystic gap
zero wrote:
divs should do it. IE often needs a width like 99%
yes it does :) adding width solved IE overflow issue! thank’s
Offline
Pages: 1