Laila – CSS help needed

Please, bear in mind there are over 700 themes or more… so nobody is able to remember all of them, where to find them etc. (a source if welcome)
When you have such a specific question it is always recommended to post a link to the blog.
1. faux columns?
2. You should work with Category_Templates and this thread.
3. Firefox > Dev Toolbar > Outline Block level elements?

Hi moshu,

1. Hmm, yee-ee-ah? Not sure.

2. Thanks, that’s what I needed

3. Tried that, but it doesn’t really help. There’s “whitespace” I can’t pinpoint. But I’ll ask the theme developer about that.

Unfortunately I can’t post the blog address, it’s in dev and expressly not to be shown as per client’s decision.

Greetings

LHK

Then a link to the theme at least?

Hi again,

https://cinila.com/journal/2006/03/15/laila-butterfly-themes-for-wordpress/

or (found between posts)

https://orangescale.com/more/demo/laila-wp/

The new Laila theme does some of what I want, but to me looks “less” attractive than the older version.

The one major question still for me is the column thing.

I had a similar issue with columns, and initially didn’t like the idea of faux columns. But without tables (of which I want to have none in my html) I couldn’t find a way to work around the difference in height without specifying a min-height for the element containing my content. I warmed to the idea of faux columns and found it worked like a charm.

The theme you’ve linked to seems to be absolutely positioned anyway, so I would recommend this method. You can always layer images to create the illusion of whatever edge you would like at the top and bottom as well.

Hi again,

what about IE 7.0? I’m told it will break quite some hacks.

And actually asking those who dabbled with a tabled WP layout: did anyone ever get that to work across table cells?

Re: IE 7

The faux columns aren’t really a hack per se. As long as your css elements are positioned correctly I can’t see how a new brower would cause them to stop working.

(Was that what you were talking about?)

Re: Tabled Layout

I haven’t used a tabled WP layout but I guess it would look something like this (for a 2 column layout with the sidebar on the right):

<table border="0" margin="0" padding="0">
<tr>
<td>
// Header code here
</td>
</tr>
<tr>
<td // Background for main body here>
// Main body code here
</td>
<td // Background for sidebar here>
// Sidebar code here
</td>
</tr>
<tr>
<td>
// Footer code here
</td>
</tr>
</table>

If the sidebar becomes longer than the content, the height of the content should stretch to match that of the sidebar.

(BTW is there a way to preserve tabs in code you paste here?)

Hi,

as Laila has clear space above and below the wrapper, simple faux columns wouldn’t work. The floating faux column trick seems to – as I remember – use some of the IE box model hacks. And that’s bound to eventually give a huge headache.

I tried the tabled layout (long while ago, around WP 1.3 or thereabouts) and ran into trouble with The Loop. I simply didn’t get it to work much as I wanted to. Period. Sigh.

So now I wonder whether this still is the case. Actually popping WP elements into a table would solve my design problem in a splitsecond and spare me a huge CSS headache.

It’s truly funny (actually) that as we speak CSS can’t lick the most simple tricks in basic structure. Compared to the hoop jumps one has to execute when wanting a very simple linear CSS layout which at the same time is cross-browser compatible, CSS creates more complicated markup than tables.

Oh well, my side of the planet it’s still early early morning… a coffee and I retry that tabled layout…

Would it be possible to create a container div that has the property height: auto and the background you want (with background-repeat: repeat-y as you’re aware) and then floating your content and sidebar in it (both with transparent backgrounds)?

That way you wouldn’t have to worry about what’s above or below the container div, so you could place the header and footer outside or use clear: both.

Sorry if I’m just telling you stuff you already know and don’t need to hear again. You seem to have explored most options already.

Good luck!

Hi,

actually I would have preferred not to re-write the complete Laila theme ?? And if I have to do a re-write, I’d prefer a quick and dirty solution. That’s part of the (my) problem.

Anyone know of a successful tabled WP layout?

Long Answer: If you know how to write html, a table based layout would NOT be that difficult. Tables are infinitely easier to deal with than pure CSS based layouts, after all.

Its merely a matter of putting the stuff inside the tables.

I mean NO disrespect honestly, You are being paid for this arent you? You mentioned it being a client site….

Short answer: Ive never seen a table based theme thats in the public domain. WP users tend to shy away from them ??

Hi again,

short answer – no for that one I’m not paid ?? It’s a friend’s site. A good friend, who’s herself an artist and has a pretty precise idea of what she wants ;-} and she knows little enough of markup and webdesign to expect me to do it “just so”…

Basically the following problems exist or persist (as you wish ;-)):

– Basic layout should be like in Laila (basic as in what goes where)

– we are rooting for two variants: a photo/colored one, or a drawings/stark-b/w one.

The colored one can be easily done with Laila practically as is (except for the non-matching column lengths which bug me personally). It’s done (except for the box lengths) and looks quite ok so far.

The drawings one needs fine 1px borders around certain blocks (sidebar, topnav bar, picture insert, main content, footer) with no “doubled” lines.

Now, while I can “construct” this thing in CSS with image backgrounds (nope – to CSS the borders in is not that easy a gimmick, precisely for the differing heights and hacks needed), I’d create havoc with my nerves doing that – while it takes about 10 seconds with plain tabled layout and pronto!, plus it would even nicely display in different browsers.

The only problem I so far have with WP and tables is, that it (WP) doesn’t work. I even had a close look at Bionic Jive which truly didn’t help me much.

Probably I’m just dense, I dropped the WP calls in the relevant table cells with the Loop going in the largest one supposed to hold the posts. The clean table code (without WP tags/calls):

‘<table width=”750″ border=”1″ cellspacing=”0″ cellpadding=”0″ bordercolor=”#000000″>
<tr valign=”top”>
<td colspan=”2″></td>
</tr>
<tr valign=”top”>
<td height=”170″></td>
<td rowspan=”2″ width=”250″></td>
</tr>
<tr valign=”top”>
<td width=”500″></td>
</tr>
<tr valign=”top”>
<td colspan=”2″></td>
</tr>
</table>’

Just looking at it tells you how little markup this is compared to what I’d need to CSS that. ??

It’s for such things that I find myself saying “why the heck should I use CSS if I can solve things so easily?” and “F..k the anti-table fraction”.

??

I like CSS, I’m certainly not anti-CSS, but I’m no purity fanatic, I’m a down to earth practical realist.

And just to insert an (concededly very small) edge into the “table is over and not for design” debate I watch going on these days: THIS is as much tabular data as pure lists are. The design this intends to achieve is straight from the hard cover (comic strip) sheaf page that the content (for that blog) is drawn on. I see absolutely no single valid reason not to use the same table the artist draws with ruler and inkpen on the webpage.

??

Back to the problem. I’d love to use this table for this theme variant. It’s easy, clean and elegant. But I can’t get WP to function inside it. As I said, I’m probably too dense to wrap my brain about what WP code needs to go where with such a table.

I just tried putting my blog in tables, and it seemed to work. The WordPress functions remained intact.

As long as you keep your post loop in one piece (everything between <?php if (have_posts())... and <?php endif; ?>) it should be ok.

I think the reason most people don’t use tables is because it’s often difficult to create a design that is consistent across browsers.

I’ve used tables extensively in the past for creating the look I want in WP. Of course WP has no issues with them, why would it? I actually never realised how little tables are used in theming WP until this thread. I still personally think a mixture of CSS and tables is healthy.

I think the majority of WP users look to CSS for their answers quite simply because

a.) It’s more flexible for layouts
b.) The Code Standards Gestapo make it very difficult to work with tables and validate your site.
c.) Like Web 2.0, CSS is trendy.

??

Hi again,

….The Code Standards Gestapo make it very difficult to work with tables and validate your site……

If I get this simple tabular layout working as it should I probably will offer it for download to those wishing to lick this kind of problem without bending CSS backwards.

I too was astonished at how few tabled layouts are available and as I explained, I believe there are quite a few instances when they are the best and most elegant choice.