Incorrect values returned by MountedData::get_client_rect()

[jeancf]

Problem

The first call to MountedData::get_client_rect() in onmounted returns incorrect values.

Steps To Reproduce

• create main.rs

  
  #![allow(non_snake_case)]

use dioxus::prelude::*; use log::LevelFilter;

fn main() { // Init debug dioxus_logger::init(LevelFilter::Debug).expect("failed to init logger");

dioxus::launch(App);

}

[component]

fn App() -> Element {

rsx! {
    link { rel: "stylesheet", href: "main.css" }
    div {
        "class": "box",
        position: "absolute",
        top: "150px",
        left: "150px",
        onmounted: move |ev: Event<MountedData>| async move {
            let rect = ev.data().get_client_rect().await.unwrap();
            log::debug!("{:?}", rect);
        },
        "BOX"
    }
}

}

- create main.css

.box { border: 1px solid black; width: 100px; height: 100px; color: black; }

- run `dx serve`
- observe `[DEBUG] graph - Rect(31.6875x22.0 at (150.0, 150.0))` in the log  ***incorrect***
- change attribute to `top: "200px",` then back to `top: "150px",` for example
- observe `[DEBUG] graph - Rect(102.0x102.0 at (150.0, 150.0))` in the log  ***correct***

**Expected behavior**

The correct dimensions are reported right away: `Rect(102.0x102.0 at (150.0, 150.0))`.

I think that the value of the attributes set in the css file are not taken into account correctly at the first call. If I move the `width` and `height` attributes from the css file directly into the element, the first call returns `Rect(100.0x100.0 at (150.0, 150.0))` which is still incorrect but correctly takes into account the values of width and height (the difference is the border thickness, that is still set in the css file).

**Environment:**
 - Dioxus version: `0.5.1`
 - Rust version: `1.77.2`, `stable`
 - OS info: `Manjaro Linux` - App platform: `desktop`