doug 0

I am not a designer (which will become obvious in a moment); however, like most programmers, i often need to create very simple pages for wikis, internal department home pages, etc.

I am using the Google Chart API which (for certain chart types) renders a chart in Flash. More specifically, the output of my code is a large html object that wraps the Flash chart

This is the markup that wraps the Flash chart :

<div id="AnnotatedTimeLineID1a7de968" style="width: 840px; height: 360px;">
</div>

This is the only container in the page other than the The chart itself looks good, now i just want to add two more below it, column-wise, align them on the page, and perhaps add a background color for the page, etc.

To do this, i added, just before the closing tag, the markup to reference to the stylesheet:

<link href="/stylesheets/dashboard.css" rel="stylesheet" type="text/css">

Then i put this code in my stylesheet referred to in the div tag above:

div#ATLID001 {
    width:50%;
    margin-top: 30px;
    margin-left:auto;
    margin-right:auto;
    background-color: #B2BEB5;
}

This has not effect on how the html page renders in the browser.

Is there an idiosyncratic markup for styling Flash objects?

Or do i need to create another container wrapping the

?

  • I'm assuming your ID in the CSS is just shortened because you didn't want to rewrite it. Otherwise, you'll never get a match... But I'll assume that for now Ktash almost 8 years ago

2 answers

Ktash 1851
0
points
This was chosen as the best answer

Two things. First, what you're targeting in your CSS is your wrapping div, which will not style the embed inside of it. To target the flash object, you'll want to do:

#AnnotatedTimeLineID1a7de968 embed {
    /* CSS goes here */
}

Secondly, the width and height on you div are going to override your CSS styles, so if you wanted the div to have width: 50%;, then you'll want to throw out the inline styles.

Answered almost 8 years ago by Ktash
  • nice one-solved the problem (marked 'best answer', (not sure how to upvote or if u need rep to do that, which it seems) doug almost 8 years ago
  • Marking as best is up-voting :) Thanks, glad to hear it solved the problem. Ktash almost 8 years ago
sbuk 30
0
points

Try changing the CSS link to this;

<link href="stylesheets/dashboard.css" rel="stylesheet" type="text/css">
Answered almost 8 years ago by sbuk
  • That's really only a relative vs absolute filepath change, and I'm not sure that that would be the issue if he's seeing other styles working... Ktash almost 8 years ago