By jason342 on

Hi, I don’t know much about stylesheet and I don’t want to break my drupal either, not for the seventh time anyway.

I have a banner that appears in my node pages, the banner is in a standard table, and it aligns to the right.

I was advised to ”Surround banner in a DIV instead, and have it floating to the right in CSS”.

So, I have a code (banner) that’s in the standard table. Can you please show me the DIV that surrounds it, and make it float and modifiable in CSS?

Thanks

⋅ Categories: Drupal 4.7.x

Comments

nofue’s picture

nofue commented

Servus, Jason.

I think it depends on how you bring your banner-containing table to the page(s). Is it a node of its own, shown in a block? Then you could theme that block. Or did you hardcode it to the page.tpl.php? Then lookup the <table> tag and edit that like you would with any HTML. The DIV to center content is in your .CSS file (screen.css, most likely):

div#mybanner {
text-align: center;
}

and in some source generating .tpl.php file (block..., node..., page...) you'll put it in like this:

<?php 
...
<table><tr><td id="mybanner"> //here comes the banner-code
</td></tr></table>
...

Well, in fact there are a lot more possibilities to put some block centered. But it's hard to guess which one would fit your situation best...

Norbert

-- form follows function

Norbert

-- form follows function

jason342’s picture

jason342 commented

To be more specific this is how I got the banner to the Page it self.

1. I placed a <?php include ‘banner.php’; ?> code in node.tpl.php
2. I put the code for the banner in the banner.php file
3. The banner automatically shows up in my node pages.

So I assume the div needs to be added to the code in the banner.php, But don't know how to do the Div and the Stylesheet codes?

nofue’s picture

nofue commented

Servus, Jason.

In node.tpl.php, you add two lines of code:

<div class="myBannerStyle">
<?php include 'banner.php'; ?>
</div>

In styles.css, you create a new stlye -- something like this:

.myBannerStyle {
border: 1px solid red;
}

and voilá, your banner should have a red border...

If you want to center your banner within a given area on screen ('a block' as it is called in css), you may use a second definition:

<div class="myBannerPosition">
<div class="myBannerStyle">
<?php include 'banner.php'; ?>
</div>
</div>

In styles.css, you create a new stlye -- something like this:

.myBannerStyle {
border: 1px solid red;
}

.myBannerPosition {
text-align: right;
}

Now the first block (sequence of creation at output (i.e. in .php) matters) is myBannerPosition. Every content of this block gets right aligned. Now you insert the div for your banner, which gets right aligned within the outer block. There's a lot of ways to get this thing right, and doing some css would be a good idea at this point. There are a lot of nice online tutorials on this matter, so...

Norbert

-- form follows function

Norbert

-- form follows function